1.w3c標準
w3c標準是由全球資訊網聯盟制定的一系列標準,包括:
結構化標準語言(html和xml)
表現標準語言(css)
行為標準語言(dom和ecmascript)
w3c標準倡導結構,樣式,行為分離
2.css中的定位機制
css中存在3種定位機制:
標準文件流(normal flow):從上到下,從左到右,輸出文件內容,由塊級元素和行級元素組成
浮動(floats)
絕對定位(absolute positioning)
3.塊級元素和行級元素
塊級元素的特點是,從左到右撐滿頁面,獨佔一行,觸碰到頁面邊緣時,就會自動換行,常見的塊級元素有,div,ul,li,dl,dt,p;常見的行級元素有:span,strong,img,input,他能同向的排列在同一行中
4.盒子模型
盒子模型是網頁布局的基石,它包括四個部分,邊框border,外邊距margin,內邊距padding,盒子中的內容content
在設定它的屬性值時可以同時設定,也可以分別設定,比如
margin-right:0px;
margin:10px 20px 30px 40px;(上,右,下,左)
margin:10px 20px 30px;(上,左右,下)
margin:10px 20px;(上下,左右)
margin:10px;(上下左右屬性值相同)
5.css按位置分類行內樣式:(又叫內嵌樣式,內聯式),比如:
內部樣式:(又叫嵌入式),是放在 標籤中,比如:
以上三種樣式的優先順序:內聯式》嵌入式》外部式(就近原則)
6.類選擇器,id選擇器,子選擇器,包含選擇器,通用選擇器
類選擇器:
.類選擇器名稱
.ide
...
id選擇器:
#ide
類選擇器和id選擇器的區別在於,id選擇器只能在文件中使用一次,注意這裡的使用一次並不是指文件只能定義乙個id選擇器
可以使用多個類選擇器為乙個元素同時設定多個樣式
子選擇器:
.ide>li
包含選擇器:
.ide li
子選擇器和包含選擇器的區別:「〉」作用與元素的第一代後代,「空格」作用於元素的所有後代
通用選擇器:
作用:匹配html中所有的標籤元素
**
7.偽類選擇符和分組選擇符偽類選擇符:
a:hover
分組選擇符:**前後等價
h1,span
h1span
8.css中樣式的繼承性和重要性繼承性:css中某些樣式具有繼承性,比如顏色屬性可繼承,邊框屬性不可以
重要性:
pp
9.居中問題第一,被設定的元素為文字或者等行內元素時
text-align:center;
第二,被設定元素為塊狀元素時
width:500px;
margin:20px auto;
第三,不定寬塊狀元素
加入table標籤,為需設定的居中元素外面加入乙個table,為table設定屬性
.qq
wwwww
第四,垂直居中
-----父元素高度確定的單行文字
.qq p
qqqqq
----- 父元素高度確定的多行文字,,塊狀元素
方法一,插入table(tbody,tr,td)
由於td標籤預設設定了rertical-align為middle,所以無需再設定其他
方法二,在div中設定css樣式(不相容ie6,7)
.qq
qqqqqqqqqq
10 常見css樣式
font-family:"microsoft yahei"
font-style:italic;
font-size:20px;
text-decoration:underline;
text-decoration:line-through;
pborder:1px solid red;
border:2px dashes red;
border:1px dotted red;
css入門介紹
css 層疊樣式表 英文名 cascading style sheets 主要用於美化網頁 1 css的表現形式 1.1 行內樣式 內嵌樣式 寫在標籤內的樣式,寫在標籤的開始部分的內部,style屬性當中,即 1.2 內部樣式 內聯樣式 寫在html頁面中,存放於標籤當中,樣式則寫在style標籤中...
CSS入門介紹
為了讓網頁元素的樣式更加豐富,也為了讓網頁的內容和樣式能拆分開,css由此思想而誕生,css是 cascading style sheets 的首字母縮寫,意思是層疊樣式表。有了css,html中大部分表現樣式的標籤就廢棄不用了,html只負責文件的結構和內容,表現形式完全交給css,html文件變...
CSS入門介紹
一.背景 這裡將陸續介紹前端css中相關知識,先介紹css2.1,後續會介紹css3的相關屬性,通過該系列的文章,希望能給準備轉戰前端的人員一些幫助,同時也幫助自己梳理知識,文章中如有錯誤,歡迎指出。下面是css2.1第乙個階段的知識框圖,後面會陸續更新該系列後續文章。二.整體介紹 一 基礎介紹 1...