【網頁前端設計Front end】CSS入門（看不懂你來打我）

css的基本語法和使用方法

/*選擇符組*/
/*類選擇符*/
/*id選擇符*/
#intro
{
	font-size:110%;
    font-style:italic;
    color:#0000ff;
    background-color: transparent
}
/*包含選擇符*/
table a
{
	font-size:10px;
}/*僅表格內的鏈接改變了樣式
/*樣式表的層疊性*/
div{color:red; font-size:9pt;}
p{color:blue;}/*段落文字爲藍色9號字*/

css的層次及其作用優先級

<div style="color:bule">
hello,word
</div>/*行內樣式表*/
<style type="text/css">
div{
	color:blue;
}
</style>/*文檔層樣式表*/
/*這段定義一般是放在head裏面的。如此定義之後，該頁面所有的div就可以使用統一的顏色設置了。
/*外部樣式表，在default.css文件裏有：*/
.myclass
{
	color:yellow;
}
/*然後在頁面中引用改樣式表文件*/
<link rel="stylesheet" href="default.css"/>
/*外部樣式表的鏈接位於文檔的頭部位置*/

css常用屬性

body
{
background-image:url(backgroound);background-repeat:repeat-x
}/*圖片橫向重複*/
/*邊框顏色屬性*/
.dd{border-color:gray;border-style:solid;}
/*css邊距屬性*/
.md{margin-left:1cm;}
/*css間隙屬性*/
.p1{padding-right:1cm;}
/*css列表樣式屬性*/
ul{list-style-image:url(dot02.gif)}
/*css錨僞類*/
a:link{color:#FF0000;}/*表示未被訪問的鏈接設置爲紅色*/

css佈局

1.css盒模型
2.1 創建div對象
2.2 定位屬性
2.3 浮動屬性
3 css佈局結構
4 單雙列結構