CSS DIV(區塊) / SPAN

介紹 DIV(區塊) 與 SPAN屬性設定 屬性值應用

DIV(區塊) Div 是個區塊容器標籤,可將內容分為不同的區塊,裝入各html元素於其 中,含蓋範圍大。

SPAN(小區塊) SPAN 是個小容器標籤,被包夾於某單一html元素內,借以改變該元素中的部份屬性,含蓋範圍小。


CSS DIV是個大容器:

DIV範圍開始(h1元素的標題)

DIV 也可設定框線顏色、線條粗細樣式

這行是p元素寫的,div容器區塊裡包了H1與P 元素

DIV範圍結束

CSS SPAN是個小容器:

這是p元素寫的,p元素內包夾了SPAN 借以改變看到這區段改變吧?!,SPAN只影響這小段P 元素內部份的屬性值被SPAN的屬性值替代佔去


範例::檢視Div 影響範圍比Span大

範例觀測重點 :Div內可包含多個元素,Span則是被元素所包夾

你可觀察到 :DIV 樣式內設color紅色,那麼Div內的元素都受影響,成紅色字

實驗看看

你可以在上方單行內樣式修改margin數值:

style='margin:30px;' /* 增大框邊值改變了邊框外邊界留白空間大小 */