三 CSS字型屬性

2021-10-21 17:44:41 字數 2095 閱讀 1096

css fonts(字型)屬性用於定義字型系列、大小、粗細、文字樣式(如斜體)。

css使用font-family屬性定義文字的字型系列。

p 

div

在開發中,直接給 body標籤 指定字型格式,一般標籤都是放在body標籤中的,則所有的標籤都會使用這種字型。

當 font-family: arial,"microsoft yahei", "微軟雅黑"; 中存在多種字型時,優先使用第一種字型,如果使用者瀏覽器中沒有,則使用第二種,以此類推。若都沒有,則使用瀏覽器中的預設字型。

那一抹眾人中最漂亮的顏色,

優雅,淡然,又那麼心中清澈,

前端總是伴隨著困難和犯錯,

精心,坦然,攻克乙個又乙個,

拼死也要克服它,

這是pink的秘密也是pink老師最終的囑託。

css使用 font-size 屬性定義字型大小。

p
標題標籤h比較特殊,需要單獨指定大小

css使用 font-weight 屬性設定文字的粗細,可以查閱css中文手冊

語法:font-weight :normal|bold|bolder|lighter|number

引數:normal :正常的字型。相當於number為400。宣告此值將取消之前任何設定

bold :粗體。相當於number為700。也相當於b物件的作用

bolder :ie5+ 特粗體

lighter :ie5+ 細體

number : ie5+ 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900

屬性值描述

normal

預設值(不加粗的)

bold

定義粗體(加粗的)

100-900

400等同於normal,而700等同於bold 注意這個數字後面不跟單位

css使用 font-style 屬性設定文字的風格

p
屬性值

作用normal

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

italic

瀏覽器會顯示斜體的字型樣式

同學,上課時候的你

下課時候的你

注意:平時我們很少給文字加斜體,反而要給斜體標籤(em,i)改為不傾斜字型。

字型屬性可以把以上文字樣式綜合來寫,這樣可以更節約**:

body
例如:

div
使用 font 屬性時,必須按照上面的語法格式順序書寫,不能更換順序,並且各個屬性以空格隔開

不需要設定的屬性可以省略(取預設值),但是必須保留 font-size 和font-family 屬性,否則 font 屬性將不起作用,如:font:20px '黑體';

屬性表示

注意點font-size

字型大小我們通常用的單位是px畫素,一定要帶上單位

font-family

字型實際工作中按照團隊約定來寫字型

font-weight

字型粗細

記住加粗是 700 或者 bold ,不加粗是 normal 或者 400,記住數字不要跟單位

font-style

字型樣式

記住傾斜是 italic 不傾斜是 normal 工作中我們最常用 normal

font

字型屬性連寫

1.字型連寫是有順序的,不能隨意換位置2.其中字型大小和字型必須同時出現

字型復合屬性如何寫?裡面有什麼注意細節?

如何讓加粗的文字不加粗顯示,如何讓傾斜的文字不傾斜顯示?

CSS字型屬性

字型族科 語法 font family 族科名稱 種類族科 族科名稱 種類族科 允許值 族科名稱 任意字型族科名稱都可以使用 種類族科 serif e.g.times sans serif e.g.arial or helvetica cursive e.g.zapf chancery fantas...

css字型屬性

css字型屬性用於定義字型的顏色,大小和樣式。font family 用於定義字型的樣式,如黑體,宋體等等。在使用font family時要注意以下幾點 1 在開發中不要使用自己電腦上特有的字型,因為我們寫的網頁是讓其他使用者看的,樣式特殊的話,其他人的電腦上可能沒有這種字型,就會顯示出現效果差。2...

CSS字型屬性

這個屬性設定字型名稱,如arial,tahoma,courier等。例句如下 s1 演示示例 這個屬性可以設定字型的大小。字型大小的設定可以有多種方式,最常用的就是pt和px pixel 例句如下 s2 演示示例 這個屬性有三個值可選 normal,italic,oblique。normal是預設值...