horizonal scroll bar,vertical top align ,display conten in one line css for table or div_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-24 12:28:41
Original
1313 Leute haben es durchsucht

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

.box
{
 overflow:auto;     // 1。

.....
当table内容过高或过长时自动产生scroll bar
}
.tbcontent{
font-family: Arial, Tahoma, Verdana, Calibri;
border:solid #ababab;
-moz-border-radius: 5px;
border-bottom-width: 2px;
border-top-width: 25px;
width: 100%;
text-align:left;
}
#customers
  {
  font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
  width:100%;
  border-collapse:collapse;
  border:solid #999999;
  border-bottom-width: 2px;
  border-top-width: 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。...................
Column Header 1Column Header N
当列数过多的时候 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;}

// 4.能实现两个div 上对齐

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!