CSS的全稱是什么?
層疊樣式表（英語：Cascading Style Sheets肺孵，簡寫 CSS），又稱串樣式列表颜阐、級聯(lián)樣式表平窘、串接樣式表、層疊樣式表凳怨、階層式樣式表瑰艘，一種用來為結(jié)構(gòu)化文檔，如HTML 文檔或XML文檔應(yīng)用肤舞，添加樣式（字體紫新、間距和顏色等）的計算機(jī)語言，由** W3C** 定義和維護(hù)李剖。
CSS有幾種引入方式? link 和@import 有什么區(qū)別?
CSS的四種引入方式
- 內(nèi)聯(lián)樣式
<h1 style="color: red; font-size: 20px;"></h1> - 內(nèi)部樣式
<style type="text/css">
h1 {
color: red;
font-size: 20px;
}
</style>
<h1>CSS</h1> - 外部樣式
<head>
<link rel="stylesheet" type="text/css" href="index.css">
</head> - 導(dǎo)入CSS@import
<style>
@import url("hello.css");
@import "world.css";
</style>
link 和@import 有什么區(qū)別?
- link標(biāo)簽不止可以加載CSS芒率，而且還可以做很多其它的事情，比如定義RSS篙顺，定義rel連接屬性等偶芍，@import就只能加載CSS了充择。
- 加載順序的差別。當(dāng)一個頁面被加載的時候（就是被瀏覽者瀏覽的時候）匪蟀，link引用的CSS會同時被加載椎麦，而@import引用的CSS會等到頁面全部被下載完再被加載。
- 兼容性的差別材彪。由于@import是CSS2.1提出的所以老的瀏覽器不支持观挎，@import只有在IE5以上的才能識別，而link標(biāo)簽無此問題查刻。
-
使用dom控制樣式時的差別键兜。當(dāng)使用javascript控制dom去改變樣式的時候，只能使用link標(biāo)簽穗泵，因為@import不是dom可以控制的普气。
因此，從網(wǎng)頁性能的的角度考慮佃延，應(yīng)該避免用@import现诀，常用<link>標(biāo)簽。
以下這幾種文件路徑分別用在什么地方履肃，代表什么意思?
-
相對路徑（本地文件的相對路徑）
當(dāng)前目錄下的css文件夾中的a.css
css/a.css
當(dāng)前目錄中css文件夾中的a.css文件
./css/a.css
當(dāng)前目錄下的b.css文件
b.css
上級目錄中的imgs 文件夾中的a圖片
../imgs/a.png -
絕對路徑（本地文件的絕對地址）
本地絕對路徑中的a.css文件
/User/hunger/project/css/a.css -
網(wǎng)站路徑
網(wǎng)站中也可以使用相對路徑
css/a.css
網(wǎng)絡(luò)中的路徑
http://cdn.jirengu.com/kejian1/8-1.png17
如果我想在某個網(wǎng)站上展示一個圖片仔沿，需要怎么操作?
- 如何網(wǎng)絡(luò)中已有圖片，可以直接通過輸入網(wǎng)站路徑展示圖片尺棋。
- 在本地中直接上傳到服務(wù)器中封锉，使頁面展示其上傳圖片。
列出5條以上html和 css 的書寫規(guī)范
- 語法不區(qū)分大小寫膘螟，但建議統(tǒng)一使用小寫
- 不使用內(nèi)聯(lián)的style屬性定義樣式
- id和class使用有意義的單詞成福，分隔符建議使用
- 有可能就是用縮寫
- 屬性值是0的省略單位
- 塊內(nèi)容縮進(jìn)
- 屬性名冒號后面添加一個空格
截圖介紹 chrome 開發(fā)者工具的功能區(qū)
- Element:元素面板--檢查和調(diào)整頁面，編輯樣式/DOM
- Sources:源代碼面板--設(shè)置端點(diǎn)來調(diào)試js,或通過workspaces鏈接本地文件來使用開發(fā)者工具的實時編輯器荆残。
- Console:控制臺面板--記錄診斷信息奴艾，或者作為shell在頁面上寫js交互
- Network:網(wǎng)絡(luò)面板--了解請求和下載的資源文件并優(yōu)化網(wǎng)頁加載性能
- Performance:性能面板--使用時間軸面板可以通過記錄和查看網(wǎng)站生命周期內(nèi)發(fā)生的各種事件來提高頁面的運(yùn)行時性能。
- Memory:內(nèi)存面板--如果需要比時間軸面板提供的更多信息内斯，可以使用“配置”面板蕴潦，例如跟蹤內(nèi)存泄漏。
- Application:應(yīng)用面板--使用資源面板檢查加載的所有資源俘闯，包括IndexedDB與Web SQL數(shù)據(jù)庫潭苞，本地和會話存儲，cookie备徐，應(yīng)用程序緩存萄传，圖像，字體和樣式表蜜猾。
-
Security:安全面板--使用安全面板調(diào)試混合內(nèi)容問題秀菱，證書問題等等。
1.jpg
2.jpg
3.jpg
4.jpg
5.jpg
6.jpg
7.jpg
