CSS的全稱是什么?
CSS全稱Cascading Style Sheets,層疊樣式表
CSS有幾種引入方式? link 和@import 有什么區(qū)別?
有三種引入方式:內聯(lián)樣式,內部樣式,外部樣式。
link和@import區(qū)別:
- link是XHTML的標簽,@import是CSS的語法。
- 加載順序的區(qū)別,當一個頁面被加載的時候(就是被瀏覽者瀏覽的時候),link引用的CSS會同時被加載,而@import引用的CSS 會等到頁面全部被下載完再被加載。
- 兼容性的差別,由于@import是CSS2.1提出的所以老的瀏覽器不支持,@import只有在IE5以上的才能識別,而link標簽無此問題。
- 使用javascript控制dom去改變樣式的時候,只能使用link標簽,因為@import不是dom可以控制的。
以下這幾種文件路徑分別用在什么地方,代表什么意思?
相對路徑:相對于當前目錄的路徑
css/a.css 當前目錄下css中的a.css
./css/a.css 當前目錄下css中的a.css
b.css 當前目錄下的b.css
../imgs/a.png 上級目錄下imgs中的a.png
絕對路徑:本地文件的絕對地址
/Users/hunger/project/css/a.css
網站路徑
/static/css/a.css網站路徑的相對路徑
http://cdn.jirengu.com/kejian1/8-1.png 線上的圖片地址
如果我想在js.jirengu.com上展示一個圖片,需要怎么操作?
把本地圖片上傳到一個圖床網站,生成一個地址,添加到img標簽中展示
列出5條以上html和 css 的書寫規(guī)范
css書寫規(guī)范:
- 語法不區(qū)分大小寫,建議統(tǒng)一使用小寫
- 不使用內聯(lián)style屬性定義樣式
- 用<link>調用CSS樣式
- 盡量避免@import調用方法
- 寫CSS的時候塊內容縮進
- 屬性名冒號后面添加空格
- 屬性值是0不寫單位
- id和class 建議使用有意義的單詞,單詞間用分隔符-連接
HTML書寫規(guī)范:
- 遵循標簽語義化原則,避免標簽亂用
- 要求結構清晰,結構層級扁平化處理
- 標簽用來表達結構,而不是形式樣式
- 屬性值必須用雙引號括起來
- 不使用屬性簡寫
- 不是標簽一部分的特殊符號都用編碼表示
截圖介紹 chrome 開發(fā)者工具的功能區(qū)
2.png
Elements: 允許我們從瀏覽器的角度看頁面,也就是說我們可以看到chrome渲染頁面所需要的的HTML、CSS和DOM對象。此外,還可以編輯這些內容更改頁面顯示效果;在這里選中某一DOM對象時,網頁中相應元素也會被陰影覆蓋。我們可以對DOM對象進行修改,修改后結果會在頁面實時顯示出來
Network: 可以看到頁面向服務器請求了哪些資源、資源的大小以及加載資源花費的時間,當然也能看到哪些資源不能成功加載。此外,還可以查看HTTP的請求頭,返回內容
Styles: 顯示用戶定義的樣式,比如請求的default.css中的樣式,和通過Javasript生成的樣式,還有開發(fā)者工具添加的樣式
Console: 顯示各種警告與錯誤信息,并且提供了shell用來和文檔、開發(fā)者工具交互