zoukankan      html  css  js  c++  java
  • horizonal scroll bar,vertical top align ,display conten in one line css for table or div

    今天边学边做了些css的tasks.下面几点今后会用到。

    .box
    {
     overflow:auto;     // 1。<div class="box"> <table>.....</table>当table内容过高或过长时自动产生scroll bar
    }
    .tbcontent{
    font-family: Arial, Tahoma, Verdana, Calibri;
    border:solid #ababab;
    -moz-border-radius: 5px;
    border-bottom- 2px;
    border-top- 25px;
    100%;
    text-align:left;
    }
    #customers
      {
      font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
      100%;
      border-collapse:collapse;
      border:solid #999999;
      border-bottom- 2px;
      border-top- 25px;
     -moz-border-radius: 5px;
      }

    #customers td, #customers th
      {
      font-size:1em;
      padding:3px 7px 2px 7px;
      height:20px;
      text-align:center;
      white-space:nowrap;// 2。<table><th>Column Header 1</th>.........<th>Column Header N</th></tr>..........</tr></table> 当列数过多的时候 Column Header k 会显示成多行,
      }

    #customers th
      {
      font-size:1.1em;
      text-align:center;
      padding-top:5px;
      padding-bottom:4px;
      background-color:#bcbcbc;
      color:#ffffff;
      }

    #customers tr.alt td    // 3。 实现斑马线
      {
      color:#000000;
      background-color:#dedede;
      text-align:center;
      }
    .title
    {
    position:relative;
    top:20px;
    left:10px;
    color:#ffffff;
    font-weight: bold;}

    <tr style="vertical-align:top;"> // 4.能实现两个div 上对齐

    <td><div ...1> </td>

    <td><div ...2> </td>

    </tr>

  • 相关阅读:
    vue 使用sass 和less
    生命周期函数以及vue的全局注册
    vue-router的简单实现原理
    vue的三种传参方式
    配置router列表
    vue传参二
    Gym 101933E(状态压缩+记忆化搜索)
    Gym 101933 A(dp)
    Gym 101775H(dp)
    Gym 101775 D (思维)
  • 原文地址:https://www.cnblogs.com/mjgb/p/2086298.html
Copyright © 2011-2022 走看看