CSS的全稱(chēng)是什么?
CSS的全稱(chēng)是Cascading Style Sheet -- 層疊樣式表饼疙。
層疊樣式表(英文全稱(chēng)：Cascading Style Sheets)是一種用來(lái)表現(xiàn)HTML（標(biāo)準(zhǔn)通用標(biāo)記語(yǔ)言的一個(gè)應(yīng)用）或XML（標(biāo)準(zhǔn)通用標(biāo)記語(yǔ)言的一個(gè)子集）等文件樣式的計(jì)算機(jī)語(yǔ)言碉咆。
CSS不僅可以靜態(tài)地修飾網(wǎng)頁(yè)，還可以配合各種腳本語(yǔ)言動(dòng)態(tài)地對(duì)網(wǎng)頁(yè)各元素進(jìn)行格式化。
CSS 能夠?qū)W(wǎng)頁(yè)中元素位置的排版進(jìn)行像素級(jí)精確控制涵亏，支持幾乎所有的字體字號(hào)樣式晰韵，擁有對(duì)網(wǎng)頁(yè)對(duì)象和模型樣式編輯的能力。
CSS有幾種引入方式? link 和@import 有什么區(qū)別?
- 內(nèi)聯(lián)樣式
<span style="color: blue; font-size: 12px; " ></span>
- 內(nèi)部樣式
<style type="text/css">
span {
color: blue;
font-size: 12px;
}
</style>
- 外部樣式
<head>
<link rel="stylesheet" type="text/css" herf="style.css">
</head>
- 導(dǎo)入樣式
導(dǎo)入樣式和鏈接樣式比較相似拆魏，采用@import樣式導(dǎo)入CSS樣式表盯桦，在HTML初始化時(shí)，會(huì)被導(dǎo)入到HTML或者CSS文件中渤刃，成為文件的一部分拥峦， 類(lèi)似第二種內(nèi)部樣式。
@import在html中使用卖子，如下：
<style type="text/css">@import url(style.css);</style>
四種CSS引入方式的優(yōu)先級(jí)
- 就近原則
- 理論上：行內(nèi)>內(nèi)嵌>鏈接>導(dǎo)入
- 實(shí)際上：內(nèi)嵌略号、鏈接、導(dǎo)入在同一個(gè)文件頭部，誰(shuí)離相應(yīng)的代碼近玄柠，誰(shuí)的優(yōu)先級(jí)高
link和@import的區(qū)別
- link屬于html標(biāo)簽氛琢，而@import是css的語(yǔ)法。
- 頁(yè)面被加載時(shí)随闪，link會(huì)同時(shí)被加載阳似，而@import引用的css會(huì)等到頁(yè)面加載結(jié)束后加載。
- link是html標(biāo)簽铐伴，因此沒(méi)有兼容性撮奏，而@import只有IE5以上才能識(shí)別。
- link方式樣式的權(quán)重高于@import的
以下這幾種文件路徑分別用在什么地方当宴，代表什么意思?
- css/a.css —— 相對(duì)路徑 畜吊，當(dāng)前頁(yè)面同級(jí)目錄下的css文件中的a.css
- ./css/a.css —— 相對(duì)路徑，當(dāng)前頁(yè)面同級(jí)目錄下的css文件中的a.css
- b.css —— 相對(duì)路徑户矢，當(dāng)前頁(yè)面同級(jí)目錄下b.css
- ../imgs/a.png —— 相對(duì)路徑玲献，當(dāng)前頁(yè)面父級(jí)目錄下的imgs文件夾下的a.png
- /Users/hunger/project/css/a.css —— 絕對(duì)路徑，本地 /Users/hunger/project/css/目錄下的a.css
- /static/css/a.css —— 當(dāng)前服務(wù)器根目錄下/static/css/中的a.css
- http://cdn.jirengu.com/kejian1/8-1.png —— 8-1.png在http://cdn.jirengu.com下的地址
如果我想在js.jirengu.com上展示一個(gè)圖片梯浪，需要怎么操作?
方法一： 把圖片上傳到服務(wù)器上直接引用相對(duì)路徑捌年。
方法二： 把圖片上傳到網(wǎng)絡(luò)上的其他服務(wù)器，得到圖片url地址挂洛，使用這個(gè)地址展示圖片礼预。
列出5條以上html和 css 的書(shū)寫(xiě)規(guī)范
HTML常用規(guī)范(強(qiáng)制)
- 使用 4 個(gè)空格做為一個(gè)縮進(jìn)層級(jí)，不允許使用 2 個(gè)空格 或 tab 字符虏劲。
- class 必須單詞全字母小寫(xiě)托酸，單詞間以 - 分隔。
- 對(duì)于無(wú)需自閉合的標(biāo)簽柒巫，不允許自閉合,例如input励堡、br、img堡掏、hr等
- 對(duì) HTML5 中規(guī)定允許省略的閉合標(biāo)簽应结，不允許省略閉合標(biāo)簽。
- 使用 HTML5 的 doctype 來(lái)啟用標(biāo)準(zhǔn)模式布疼，建議使用大寫(xiě)的 DOCTYPE摊趾。
- 頁(yè)面必須使用精簡(jiǎn)形式币狠，明確指定字符編碼游两。指定字符編碼的 meta 必須是 head 的第一個(gè)直接子元素。
- 引入 CSS 時(shí)必須指明 rel="stylesheet"漩绵。
- 頁(yè)面必須包含 title 標(biāo)簽聲明標(biāo)題贱案。title 必須作為 head 的直接子元素，并緊隨 charset 聲明之后。
- 有文本標(biāo)題的控件必須使用 label 標(biāo)簽將其與其標(biāo)題相關(guān)聯(lián)宝踪。<label><input type="checkbox" name="confirm" value="on"> 我已確認(rèn)上述條款</label>
使用 button 元素時(shí)必須指明 type 屬性值侨糟。
其他建議規(guī)范:HTML編碼規(guī)范
CSS常用規(guī)范(強(qiáng)制)
使用 4 個(gè)空格做為一個(gè)縮進(jìn)層級(jí)，不允許使用 2 個(gè)空格 或 tab 字符瘩燥。
選擇器 與 { 之間必須包含空格秕重。
屬性名 與之后的 : 之間不允許包含空格， : 與 屬性值 之間必須包含空格厉膀。
列表型屬性值 書(shū)寫(xiě)在單行時(shí)溶耘，, 后必須跟一個(gè)空格。font-family: Arial, sans-serif;
每行不得超過(guò) 120 個(gè)字符服鹅，除非單行不可分割凳兵。
當(dāng)一個(gè) rule 包含多個(gè) selector 時(shí)，每個(gè)選擇器聲明必須獨(dú)占一行企软。
/* good */
.post,
.page,
.comment { line-height: 1.5;}
/* bad */
.post, .page, .comment { line-height: 1.5;}
- >庐扫、+、~ 選擇器的兩邊各保留一個(gè)空格仗哨。
- 屬性選擇器中的值必須用雙引號(hào)包圍形庭。
- 屬性定義必須另起一行。
- 屬性定義后必須以分號(hào)結(jié)尾厌漂。
- 文本內(nèi)容必須用雙引號(hào)包圍碘勉。
- 當(dāng)數(shù)值為 0 - 1 之間的小數(shù)時(shí)，省略整數(shù)部分的 0桩卵。
- url() 函數(shù)中的路徑不加引號(hào)验靡。
- 長(zhǎng)度為 0 時(shí)須省略單位。
- RGB顏色值必須使用十六進(jìn)制記號(hào)形式 #rrggbb雏节。不允許使用 rgb()胜嗓。
- 顏色值可以縮寫(xiě)時(shí)，必須使用縮寫(xiě)形式钩乍。
- 顏色值不允許使用命名色值辞州。
- 需要在 Windows 平臺(tái)顯示的中文內(nèi)容，其字號(hào)應(yīng)不小于 12px寥粹。
- 其他建議規(guī)范: CSS編碼規(guī)范
截圖介紹 chrome 開(kāi)發(fā)者工具的功能區(qū)
看下圖
Element 標(biāo)簽頁(yè)： 用于查看和編輯當(dāng)前頁(yè)面中的 HTML 和 CSS 元素变过。
Console 標(biāo)簽頁(yè)： 用于顯示腳本中所輸出的調(diào)試信息，或運(yùn)行測(cè)試腳本等涝涤。
Source 標(biāo)簽頁(yè)： 用于查看和調(diào)試當(dāng)前頁(yè)面所加載的腳本的源文件媚狰，可以打斷點(diǎn)進(jìn)行調(diào)試。
Network 標(biāo)簽頁(yè)： 用于查看 HTTP 請(qǐng)求的詳細(xì)信息阔拳，如請(qǐng)求頭崭孤、響應(yīng)頭及返回內(nèi)容等。
**TimeLine 標(biāo)簽頁(yè)： ** 用于查看腳本的執(zhí)行時(shí)間、頁(yè)面元素渲染時(shí)間等信息辨宠。
**Profiles 標(biāo)簽頁(yè)： ** 用于查看 CPU 執(zhí)行時(shí)間與內(nèi)存占用等信息遗锣。
Application 標(biāo)簽頁(yè)： 記錄網(wǎng)站加載的所有資源信息。
Security 標(biāo)簽頁(yè)： 判斷網(wǎng)站的安全性嗤形。
Audits 標(biāo)簽頁(yè)： 用于優(yōu)化前端頁(yè)面精偿，加速網(wǎng)頁(yè)加載速度等。
