版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進(jìn)行舉報(bào)或認(rèn)領(lǐng)
文檔簡介
1、css基礎(chǔ)入門學(xué)習(xí)筆記css概念掃瞄器前綴css驗(yàn)證工具字體樣式挑選器一般挑選器復(fù)臺挑選器交集挑選器并集挑選器后代挑選器子元素挑選器 偽類挑選器鏈接偽類挑選器:first-child偽類 塊行元素塊級元素(block-leve1)行內(nèi)元素(inline-leve1)行內(nèi)塊元素(inline-block) css三大特性層疊、繼承、優(yōu)先級特別性(specificity) 背景背景半透亮背景漸變 盒子模型元素居中外邊距合并content寬度和高度盒子陰影 浮動布局一般流(normal flow)浮動(float)定位(position)元素的定位屬性疊放次序(z-index)四種定位總結(jié) 元素的顯
2、示與躲藏display顯示visibility可見性overflow溢出溢出的文字躲藏 css技巧鼠標(biāo)樣式cursor輪廓outline防止拖拽文本域resizevertical-align垂直對齊去除底側(cè)空白縫隙 精靈技術(shù)本質(zhì)用法制作精靈圖滑動實(shí)例 字體圖標(biāo)(iconfont)字體引入到html第三步:盒子里面添加結(jié)構(gòu)追加新圖標(biāo) bfc(塊級格式化上下文)元素的顯示模式具有bfc條件的元素元素產(chǎn)生bfc條件bfc元素所具有的特性bfc的主要用途bfc總結(jié)優(yōu)雅降級和漸進(jìn)增加長名稱或詞組可以用法中橫線來為挑選器命名。不建議用法_下劃線來命名css挑選器。外部樣式表:link 是個(gè)單標(biāo)簽href:
3、定義所鏈接外部樣式表文件的url,可以是相對路徑,也可以是肯定路徑。rel:定義當(dāng)前文檔與被鏈接文檔之間的關(guān)系,在這里需要指定為stylesheet,表示被鏈接的文檔是一個(gè)樣式表文件。掃瞄器前綴掃瞄器-webkit-google chrome, safari, android browser-moz-firefox-o-opera-ms-internet explorer, edge-khtml-konquerorcssstats 在線的 css 代碼分析w3c 統(tǒng)一驗(yàn)證工具:站長工具unicode字體在 css 中設(shè)置字體名稱,挺直寫中文是可以的。但是在文件編碼(gb2312、utf-8 等
4、)不匹配時(shí)會產(chǎn)生亂碼的錯誤。xp 系統(tǒng)不支持 類似微軟雅黑的中文??梢杂梅ㄓ⑽膩硖娲?。 比如 font-family:microsoft yahei。在 css 挺直用法 unicode 編碼來寫字體名稱可以避開這些錯誤。用法 unicode 寫中文字體名稱,掃瞄器是可以正確的解析的??梢酝ㄟ^escape() 來測試屬于什么字體。字體名稱英文名稱unicode 編碼宋體simsun5b8b4f53新宋體nsimsun65b05b8b4f53黑體simhei9ed14f53微軟雅黑microsoft yahei5fae8f6f96c59ed1楷體_gb2312kaiti_gb231269774f
5、53_gb2312隸書lisu96b64e66幼園youyuan5e7c5706華文細(xì)黑stxihei534e65877ec69ed1細(xì)明體mingliu7ec6660e4f53新細(xì)明體pmingliu65b07ec6660e4f53font-weight:字體粗細(xì)字體加粗除了用 b 和 strong 標(biāo)簽之外,可以用法css 來實(shí)現(xiàn)font-weight屬性用于定義字體的粗細(xì),其可用屬性值:normal(400)、bold(700)、bolder、lighter、100——900(100的整數(shù)倍)。font : 綜合設(shè)置字體樣式用法font屬性時(shí),必需
6、按上面語法格式中的挨次書寫,不能更換挨次,各個(gè)屬性以空格隔開。注重:其中不需要設(shè)置的屬性可以省略(取默認(rèn)值),但必需保留和屬性,否則font屬性將不起作用。一般挑選器類挑選器(class):是可以多次重復(fù)用法的id挑選器:不得重復(fù)。復(fù)合挑選器交集挑選器交集挑選器由兩個(gè)挑選器構(gòu)成,其中第一個(gè)為標(biāo)簽挑選器,其次個(gè)為class挑選器,兩個(gè)挑選器之間不能有空格 h3.special并集挑選器并集挑選器(css挑選器分組)是各個(gè)挑選器通過逗號銜接而成的,任何形式的挑選器都可以作為并集挑選器的一部分??梢岳貌⒓暨x器為它們定義相同的css樣式。后代挑選器后代挑選器又稱為包含挑選器,用來挑選元素或元素組的
7、后代,其寫法就是把外層標(biāo)簽寫在前面,內(nèi)層標(biāo)簽寫在后面,中間用空格分隔。當(dāng)標(biāo)簽發(fā)生嵌套時(shí),內(nèi)層標(biāo)簽就成為外層標(biāo)簽的后代。注重:子孫后代都可以這么挑選。 或者說它能挑選任何包含在內(nèi)的標(biāo)簽。子元素挑選器子元素挑選器只能挑選作為某元素子元素的元素。其寫法就是把父級標(biāo)簽寫在前面,子級標(biāo)簽寫在后面,中間跟一個(gè) > 舉行銜接,注重,符號左右兩側(cè)各保留一個(gè)空格。注重:這里的子指的是親兒子不包含孫子、重孫子之類。偽類挑選器鏈接偽類挑選器:link :visited :hover :active注重:1. 根據(jù) lvha 的挨次, love hate 2. 偽類名稱對大小寫不敏感。:first-child
8、偽類向元素的第一個(gè)子元素添加樣式。p:first-child匹配作為任何元素的第一個(gè)子元素的 p 元素 p > i:first-child匹配全部元素中的第一個(gè) 元素 p:first-child i匹配全部作為第一個(gè)子元素的 元素中的全部元素參考文檔標(biāo)簽顯示模式轉(zhuǎn)換 display塊轉(zhuǎn)行內(nèi):display:inline;行內(nèi)轉(zhuǎn)塊:display:block;塊、行內(nèi)元素轉(zhuǎn)換為行內(nèi)塊: display: inline-block;塊級元素(block-level)每個(gè)塊元素通常都會獨(dú)自占領(lǐng)一整行或多整行,可以對其設(shè)置寬度、高度、對齊等屬性,常用于網(wǎng)頁布局和網(wǎng)頁結(jié)構(gòu)的搭建。頻繁的塊元素有、等,其中標(biāo)簽是最典型的塊元素。行內(nèi)元素(inline-level)行內(nèi)元素(內(nèi)聯(lián)元素)不占有自立的區(qū)域,僅僅靠自身的字體大小和圖像尺寸來支撐結(jié)構(gòu),普通不行以設(shè)置寬度、高度、對齊等屬性,常用于控制頁面中文本的樣式。頻繁的行內(nèi)元素有、等,其中標(biāo)
溫馨提示
- 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
- 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負(fù)責(zé)。
- 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請與我們聯(lián)系,我們立即糾正。
- 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。
最新文檔
- 自建公寓轉(zhuǎn)讓合同模板
- 蘇寧超市加盟合同模板
- GPS基礎(chǔ)知識培訓(xùn)課件
- 老房子翻新合同模板
- 保價(jià)協(xié)議合同模板
- 吊裝手勢圖片及吊裝現(xiàn)場圖片
- 社團(tuán)演出贊助合同模板
- 定做地坪工程合同模板
- 2024年大學(xué)生憲法知識競賽經(jīng)典題庫及答案(50題)
- 堅(jiān)定文化自信 共筑大國之夢 教學(xué)設(shè)計(jì)
- 形態(tài)構(gòu)成學(xué)概論
- 電商直播對消費(fèi)者購買意愿影響因素研究 以快手直播為例
- 花城版三年級上冊音樂教案全冊教案
- 氯吡格雷的經(jīng)典臨床試驗(yàn)和最新研究進(jìn)展
- XX中學(xué)高二年級學(xué)業(yè)水平考試備考實(shí)施方案
- 空調(diào)室內(nèi)外機(jī)安裝檢驗(yàn)批質(zhì)量驗(yàn)收記錄表
- GB/T 38277-2019船用高強(qiáng)度止裂鋼板
- 2023年中醫(yī)藥適宜技術(shù)推廣項(xiàng)目工作總結(jié)匯報(bào)
- 2023年北師大版初三數(shù)學(xué)圓練習(xí)一知識點(diǎn)多選題易錯題
- 2023年云南省“彩云杯”第四屆中華優(yōu)秀傳統(tǒng)文化知識競賽題庫(附含答案)
評論
0/150
提交評論