-
浮動(dòng)基本知識(shí)
查看全部 -
《盒子模型與公式》
對(duì)于子盒子,padding則是自身內(nèi)容到自身盒子的距離,margin則是自身盒子到父盒子或其他盒子的距離
對(duì)于父盒子,padding則是子盒子到自身的距離,margin則是自身盒子到其他盒子的距離
float碰到浮動(dòng)元素或者父盒子就會(huì)換行
查看全部 -
:focus?代表的是獲取焦點(diǎn)時(shí)的樣式,一旦鏈接獲取了焦點(diǎn),則它的樣式就是你設(shè)置的focus樣式
查看全部 -
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>3.1頁(yè)面頭部制作練習(xí)題</title>
<style type="text/css">
/*在此定義相關(guān)樣式,控制列表的顯示形式*/
*{margin:0; padding:0;}
body{width:100%;}
.a{
? ? width:400px;
height:150px;
background-color:red;
}
.a h3{
? ? padding-top:20px;
? ? padding-left:10px;
}
.nav li
{
? ? float:left;
? ? list-style-type:none;
? ? text-align:center;
? ? line-height:30px;
? ? padding-top:30px;
? ? padding-left:50px;
? ? }
? ? .nav li a{
? ? ? ? display:block;
? ? }
.nav li a:link,.nav li a:visited
{
? ? color:black;
? ? text-decoration:none;
}
.nav li a:hover,.nav li a:active
{
? ? color:white;
? ? background:#be3948;
}
</style>
</head>
<body>
<div class="a">
<h3>課程難度</h3>
<!--在此制作一個(gè)無序列表-->
<ul class="nav">
? ? <li><a href="#">全部</a></li>
? ? <li><a href="#">初級(jí)</a></li>
? ? <li><a href="#">中級(jí)</a></li>
? ? <li><a href="#">高級(jí)</a></li>
</ul>
</div>
</body>
</html>?
查看全部 -
<a>是一個(gè)內(nèi)聯(lián)元素,為了使<a>同時(shí)具有內(nèi)聯(lián)元素和塊級(jí)元素的屬性和特點(diǎn),即:可以在一行內(nèi)顯示多個(gè)元素,又可以設(shè)置其寬和高,同事能使其在W3C和IE中都兼容, 頁(yè)碼制作是使用:display:inlin-block;
查看全部 -
1.當(dāng)鼠標(biāo)懸浮在超鏈接上時(shí),列表項(xiàng)樣式設(shè)置既有背景圖片,又有背景顏色的,且背景圖片不重復(fù),此時(shí)在左邊顯示背景圖片,沒有背景圖片的地方顯示背景顏色。 2.鼠標(biāo)懸浮時(shí),背景顏色改變沒有占據(jù)整行,只改變了文字顏色因?yàn)?lt;a>為內(nèi)聯(lián)元素,要想它寬高起作用,就要設(shè)成塊元素 display:block。
查看全部 -
行內(nèi)樣式的優(yōu)先級(jí)高于外部樣式
行內(nèi)樣式適用于寫少量樣式的地方
查看全部 -
課程中心盒子模型分析:3部分。
查看全部 -
新聞中心制作
查看全部 -
.list?li{ width:?50px; height:?30px; float:?left; list-style-type:none;}.list?a{ display:block; height:?30px; width:?50px; text-align:center; line-height:?30px; text-decoration:none;}.list?a:link,?.list?a:visited{ color:#000; text-decoration:none;}.list?a:hover,?.list?a:active{ color:?#FFF; text-decoration:none; background-color:?#BE3948;}
查看全部 -
li{ float:?left; list-style-type:none;}li?a:link,?.li?a:visited{ color:?#000; text-decoration:none;}li?a:hover,?.li?a:active{ color:#FFF; text-decoration:none; background-color:?#BE3948;}li?a{ display:?block; line-height:30px; text-align:center;}li,?a{ width:50px; height:30px; }
查看全部 -
導(dǎo)航欄盒子模型細(xì)分
查看全部 -
導(dǎo)航內(nèi)容盒子模型
查看全部 -
Logo區(qū)域盒子模型分析
查看全部 -
頁(yè)面頭部盒子模型分析
查看全部
舉報(bào)