CSS筆記——第一階段
多段落分類樣式：
h3{
color: green;
text-align: center;
}
h5{
color: red;
}
p{
color: blue;
text-indent: 2em; （首行縮進2個漢字）
font-size: 30px;
background-color: rgba(0,255,255,0.1);
font-family: 微軟雅黑;
}
復合段落案例：
<style>
.box{
width:800px;
height:200px;
margin:0 auto;
}
.title{
text-align:center;
/*font-size:28px;
font-family:"微軟雅黑";
font-weight:normal;*/
font:normal 28px "微軟雅黑";
}
.sub_title{
text-align:center;
}
.sub_title .time{
color:#aabbcc;
font-size:14px;
}
.sub_title .nows_title{
color:#990000;
font-size:14px;
}
p{
text-indent:2em;
line-height:28px;
}
p span{
color:#3399cc;
}
input[type="button"]{
color: green;
font-weight:700;
}
input[type="text"]{
color:red;
font-size:12px;
}
</style>
</head>
<body>
<div class="box">
<h2 class="title">中乙隊賽前突然換帥仍勝毅騰 高原黑馬欲阻擊舜天</h2>
<div class="sub_title">
<span class="time">2014年07月16日20:11</span>
<span class="nows_title">新浪體育 評論中大獎（11人參與）</span>
<a href="#">收藏本文</a>
<input type="text" value="請輸入查詢條件">
<input type="button" value="搜索">
</div>
nav導航：
<style>
.nav{height: 50px;}</style>
a.one{｝
a:hover{｝
<div class="nav">
<a href="#" class="one" title="天貓">天貓</a>
彩色背景導航：
<head>
<style>
.one{background:url(images/bg1.png);}
.one:hover{background:url(images/bg5.png);}
</style>
</head>
<body>
<a href="#" class="one">五彩導航</a>
</body>
CSS筆記——第一階段