css基礎

CSS簡介:

CSS(Cascading Style Sheets):層疊樣式表

樣式定義如何顯示 HTML 元素,樣式通常存儲在樣式表中


CSS引入方式

內聯樣式:<h1 style="color:red;></h1>

內部樣式


link與@import的區(qū)別

本質上,這兩種方式都是為了加載CSS文件,但還是存在著細微的差別

- 1.link屬于XHTML標簽,而@import完全是CSS提供的一種方式。link標簽除了可以加載CSS外,還可以做很多其它的事情,比如定義RSS,定義rel連接屬性等,@import就只能加載CSS了。

- 2.加載順序的差別。當一個頁面被加載的時候,link引用的CSS會同時被加載,而@import引用的CSS會等到頁面全部被下載完再被加載。所以有時候瀏覽@import加載CSS的頁面時性能較差

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

- 4.使用dom控制樣式時的差別。當使用javascript控制dom去改變樣式的時候,只能使用link標簽,因為@import不是dom可以控制的。


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

3.1.相對路徑

css/a.css 當前目錄下的css文件夾中的a.css

./css/a.css 當前目錄中css文件夾中的a.css文件

b.css 當前目錄下的b.css文件

../imgs/a.png 上級目錄中的imgs 文件夾中的a圖片

3.2.絕對路徑(本地文件的絕對地址)

/User/hunger/project/css/a.css 本地絕對路徑中的a.css文件

3.3.網站路徑

/static/css/a.css 網站中也可以使用相對路徑

http://cdn.jirengu.com/kejian1/8-1.png9網絡中的路徑 ??


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

思路:將本地圖片上傳,通過瀏覽器加載server中文件夾內的圖片

上傳完成后,當圖片所在文件夾與html展示頁面在同級目錄中時,我們可以通過相對路徑直接調用展示

比如:img src="url" alt="some_text" style="width:width;height:height;"

這里的url是對應的相對路徑

比如/images/html5.gif

如果在另外一臺服務器中:

img src="http://www.w3schools.com/images/w3schools_green.jpg" alt="W3Schools.com"

可采用網絡路徑直接引入


html和 css 的書寫規(guī)范

1.語法統一使用小寫

2.不使用內聯樣式的style元素定義樣式,建議采用外部css

3.id和class使用有區(qū)分度的單詞

4.塊內容縮進

5.屬性名:后面加一個space

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

  • 一、css是什么? CSS全稱是Cascading Style Sheets,簡寫為CSS,稱作:層疊樣式表,又稱...
    青鳴閱讀 1,093評論 0 1
  • 1. CSS的全稱是什么? 層疊樣式表 (Cascading Style Sheets,??s寫記作 CSS), 是...
    饑人谷_oathy閱讀 378評論 0 0
  • 1.什么是CSS CSSC全稱是 Cascading Style Sheets, 層疊樣式表。一種用來為結構化文檔...
    佳聯閱讀 510評論 0 1
  • 1、CSS的全稱是什么? Cascading Style Sheets,層疊樣式表??梢杂糜陟o態(tài)的修飾網頁,也可以...
    饑人谷_akira閱讀 276評論 0 1
  • CSS的全稱是什么? CSS全程是Cascading Style Sheets層疊樣式表 CSS有幾種引入方式? ...
    Taaaaaaaurus閱讀 441評論 0 1

友情鏈接更多精彩內容