小拓展 大知識

1、

<!DOCTYPE html>
這裏的doctype是用來聲明你是屬於哪一類型的文檔,這裏指的就是html5;


2、

<html lang="en">
lang後面的內容,是爲了告訴搜索引擎爬蟲,我們的網站是屬於什麼內容的,方便搜索到我們;

這裏的en代表的English,如果是中文就是zh,等等;


3、

有的時候,我們連續寫幾對標籤,例如連續使用幾個<img>標籤,

如果設置好大小,讓圖片並排在同一行,就會發現圖片之間會有空格;

這是因爲img標籤是行級塊元素(還有行級元素和塊級元素,將在另一篇中介紹);

也就是說它帶有inline屬性值,而帶有inline屬性值的元素都具有文字特性,

所謂文字特性就是具有文字分隔符,而瀏覽器不能識別從哪兒分隔,

所以對於圖片來說,每張圖片後面都會添加一個空格(空格屬於文字分隔符);

此時解決的最簡單的方法也是最實用的方法就是在編程的時候寫成這樣

<img src="some url"><img src="some url"><img src="some url">

而不是分段展示成這樣

<img src="some url">
<img src="some url">
<img src="some url">


雖然降低了可閱讀性,但是確實能有效的解決問題;


4、

line-height屬性設置;

有的時候設置元素的寬高以及padding等值的時候,還是不能使元素垂直居中(常用於大按鈕裏面文字),

這個時候就可以使用line-height等於容器的高度,就可以使元素垂直居中了;



發佈了25 篇原創文章 · 獲贊 3 · 訪問量 2萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章