目錄

  • 塊元素 div
  • 行內元素span

塊元素 div

塊元素包括：div,h1-h6等
自己獨佔一行的元素
塊元素的CSS樣式的寬 高等等，往往都是生效的

css 設置樣式的
	通過元素的style屬性進行設置
	style = "樣式名：樣式值；樣式名：樣式值；... ... "

Javaweb之HTML常用標籤_JWei_CSS


Javaweb之HTML常用標籤_JWei_CSS_02

增大border

Javaweb之HTML常用標籤_JWei_#前端_03


Javaweb之HTML常用標籤_JWei_塊元素_04


現在需要整個塊在網頁中間

Javaweb之HTML常用標籤_JWei_CSS_05

Javaweb之HTML常用標籤_JWei_#前端_06

再來兩個塊

Javaweb之HTML常用標籤_JWei_塊元素_07


設置每個塊之間的間隔

Javaweb之HTML常用標籤_JWei_塊元素_08

Javaweb之HTML常用標籤_JWei_#html_09

設置顏色

Javaweb之HTML常用標籤_JWei_CSS_10


Javaweb之HTML常用標籤_JWei_行內元素_11

行內元素span

行內元素包括：span,img,a等
行內元素：不會自己獨佔一行的元素
行內的CSS樣式的寬、高等等、很多都是不生效的

如下樣式生效

Javaweb之HTML常用標籤_JWei_#html_12

Javaweb之HTML常用標籤_JWei_CSS_13

如下樣式不生效

Javaweb之HTML常用標籤_JWei_塊元素_14

Javaweb之HTML常用標籤_JWei_#前端_15

span的使用

現在想要特殊展示第三個div裏面的馬克龍

Javaweb之HTML常用標籤_JWei_#html_16

用<span>標籤包括這三個字

<span style="font-size: 30px;color: red;font-weight: bold;">馬克龍</span>

Javaweb之HTML常用標籤_JWei_CSS_17

Javaweb之HTML常用標籤_JWei_#html_18