CSS基礎(chǔ)

1.CSS的全稱是什么?

CSS的全稱是Cascading Style Sheet,漢語意思是“級聯(lián)樣式表”,通常又稱為“風(fēng)格樣式表(Style Sheet)”,它是用來進行網(wǎng)頁風(fēng)格設(shè)計的.

2.CSS有幾種引入方式? link 和@import有什么區(qū)別?

CSS有三種引入方式:內(nèi)聯(lián),嵌入,外聯(lián)

(1)外聯(lián)式:加link標(biāo)簽或者@import


link標(biāo)簽


import

(2)嵌入式:

(3)內(nèi)聯(lián)式:

(4)link與import的區(qū)別:1:老祖宗的差別。link屬于XHTML標(biāo)簽,而@import完全是CSS提供的一種方式。

link標(biāo)簽除了可以加載CSS外,還可以做很多其它的事情,比如定義RSS,定義rel連接屬性,等,@import就只能加載CSS了。

2: 加載時間及順序不同。使用link鏈接的css是客戶端瀏覽你的網(wǎng)頁時先將外部的CSS文件加載到網(wǎng)頁當(dāng)中,然后再進行編譯顯示,所以這種情況下顯示出來 的網(wǎng)頁跟我們預(yù)期的效果一樣,即使一個頁面link多個css文件,網(wǎng)速再慢也是一樣的效果;而使用@import導(dǎo)入的CSS就不同了,客戶端在瀏覽網(wǎng) 頁時是先將html的結(jié)構(gòu)呈現(xiàn)出來,再把外部的CSS文件加載到網(wǎng)頁當(dāng)中,當(dāng)然最終的效果也是跟前者是一樣的,只是當(dāng)網(wǎng)速較慢時會出現(xiàn)先顯示沒有CSS統(tǒng) 一布局時的html網(wǎng)頁,這樣就會給閱讀者很不好的感覺。這也是現(xiàn)在大部分網(wǎng)站的CSS都采用鏈接方式的最主要原因。

3:兼容性不同。由于@import是CSS2.1提出的所以老的瀏覽器不支持,@import只有在IE5以上的才能識別,而link標(biāo)簽無此問題。

4:使用dom控制樣式時出現(xiàn)問題。當(dāng)使用javascript控制dom去改變樣式的時候,只能使用link標(biāo)簽,因為@import不是dom可以控制的。

5: 導(dǎo)入樣式可以避免過多頁面指向一個css文件。當(dāng)網(wǎng)站中使用同一個CSS文件的頁面不是非常多時,這兩種方式在效果方面幾乎是沒有不同的,但網(wǎng)站的頁面數(shù) 達到一定程度時(比如新浪等門戶),如果采用鏈接的方式可能就會使得由于多個頁面調(diào)用同一個CSS文件而造成速度下降,但是一般頁面能達到這種程度的網(wǎng)站 也會有資本用最好的硬盤,所以這方面的因素也不用怎么擔(dān)心。

綜上所述,一般普通的站點在調(diào)用外部樣式表的時候,還是盡量選擇link鏈入外部樣式表比較好

3.以下這幾種文件路徑分別用在什么地方,代表什么意思?

相對路徑:以當(dāng)前文件所在路徑為參考來查找相關(guān)文件

css/a.css :同級文件夾下的a.css文件

./css/a.css:同級的css文件 ? ?./表示當(dāng)前文件夾

b.css:選擇當(dāng)前文件目錄中的b.css文件

../imgs/a.png:上一級文件夾中imgs文件夾里的a.png文件

絕對路徑:文件或目錄在硬盤上真正的路徑

/Users/hunger/project/css/a.css

網(wǎng)路路徑:例如開辟一個本地服務(wù)器,當(dāng)前地址為http://localhost:8080/code/index.html, 在該HTML文件中存在以下路徑:/static/css/a.css:以絕對路徑的方式在服務(wù)器中尋找a.css文件,即在服務(wù)器上直接通過該路徑尋找相關(guān)文件 ?css/a.css:以相對路徑的方式在服務(wù)器中尋找a.css文件,即在index.html文件所在路徑(目錄)中尋找css文件夾下的a.css文件

http://cdn.jirengu.com/kejian1/8-1.png:該地址可以找到定位到互聯(lián)網(wǎng)上的"8-1.png"文件


4.如果我想在js.jirengu.com上展示一個圖片,需要怎么操作?

1.上傳到服務(wù)器(從電腦本地上傳到服務(wù)器)

2.或者使用img標(biāo)簽(若該照片有網(wǎng)絡(luò)地址才可用) ?


5.列出5條以上html和 css 的書寫規(guī)范

參照https://github.com/fex-team/styleguide/blob/master/html.md

6.截圖介紹 chrome 開發(fā)者工具的功能區(qū)

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

推薦閱讀更多精彩內(nèi)容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補...
    _Yfling閱讀 13,796評論 1 92
  • 一、css是什么? CSS全稱是Cascading Style Sheets,簡寫為CSS,稱作:層疊樣式表,又稱...
    青鳴閱讀 867評論 0 1
  • CSS的全稱是什么? CSS全程是Cascading Style Sheets層疊樣式表 CSS有幾種引入方式? ...
    Taaaaaaaurus閱讀 380評論 0 1
  • 1.CSS簡介 CSS 的全稱是Cascading Style Sheets,層疊樣式表 2.CSS的引入方式 內(nèi)...
    毛毛獨角獸閱讀 334評論 0 0
  • 如果要問你哪里人口密度大?醫(yī)院肯定是備選答案之一。 省人民醫(yī)院總是人潮洶涌,尤其是早中晚三餐時間,有病人上下樓做檢...
    博琳達閱讀 665評論 0 0