「測試開發全棧-HTML」(10)css字型屬性之字型樣式和複合屬性

上午講了CSS字型屬性的粗細,下午來說下字型樣式。CSS使用font-style屬性設定文字的風格。來看下語法:

p {

font-style: normal;

}

屬性值有 normal和italic

normal是預設值,瀏覽器會顯示標準的樣式 font-style:normal;

italic 瀏覽器會顯示斜體的樣式

一起看下具體的效果:

「測試開發全棧-HTML」(10)css字型屬性之字型樣式和複合屬性

來看看對應的程式碼:

<!

DOCTYPE

html

>

<

html

lang

=

“en”

>

<

head

>

<

meta

charset

=

“UTF-8”

>

<

meta

http-equiv

=

“X-UA-Compatible”

content

=

“IE=edge”

>

<

meta

name

=

“viewport”

content

=

“width=device-width, initial-scale=1。0”

>

<

title

>

CSS字型屬性之字型樣式

title

>

<

style

>

p

{

font-style

italic

}

style

>

head

>

<

body

>

<

h2

>

明月幾時有

h2

>

<

p

>

明月幾時有,把酒問青天

p

>

<

p

>

不知天上宮闕,今夕是何年

p

>

<

p

>

我欲乘風歸去,又恐瓊樓玉宇

p

>

<

p

>

高處不勝寒,起舞弄清影,何似在人間。

p

>

<

p

>

人有悲歡離合,月有陰晴圓缺,此事古難全

p

>

<

p

>

但願人長久,千里共嬋娟。

p

>

body

>

html

>