水平スクロールバー、垂直上揃え、内容を1行で表示テーブル用CSSまたはdiv_html/css

水平スクロールバー、垂直上揃え、内容を1行で表示テーブル用CSSまたはdiv_html/css_WEB-ITnose

WBOY

リリース： 2016-06-24 12:28:41

オリジナル

1314 人が閲覧しました

今日は学習しながらいくつかの CSS タスクを実行しました。以下の点は将来使用されます。

.box
{
overflow:auto;

....

テーブルのコンテンツが高すぎるか長すぎる場合、スクロールバーが自動的に生成されます
}
.tbcontent{
font-family: Arial 、タホマ、ヴァーダナ、カリブリ;
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 th
{
font-size:1em;
padding : 3px 7px 2px 7px;
高さ:20px;
text-align:center;
white-space:nowrap;// 2. ......... .

列ヘッダー 1	列ヘッダー N

列が多すぎる場合、列ヘッダー 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:old;}

// 4. 2 つの div を整列させることができます