當前位置:妙知谷 >

職場理財 >職場就業 >

html網頁設計字體設置方式

html網頁設計字體設置方式

我們在製作網頁的時候,如果使用單一的字體和格式,往往做出來的東西比較刻板,我們可以使用css設置一些字體格式,讓網頁更加美觀。

操作方法

(01)我們打開webstorm軟件,在HTML文件中創建h1到h6六個標籤,分別font-style設置字體風格,italic斜體,normal正常,oblique傾斜,inherit指繼承格式,revert還原字體風格。unset重置屬性。

html網頁設計字體設置方式
html網頁設計字體設置方式 第2張

(02)<br />文本換行顯示,我們在使用p標籤寫段落文字的時候,在網頁中設置換行但是在實際顯示的時候還是不會有換行的格式顯示,我們需要在文字中間加上<br />符號,設置換行。

html網頁設計字體設置方式 第3張
html網頁設計字體設置方式 第4張

(03)設置字體的粗細的情況我們可以使用font-weight然後選擇字體粗細,bold粗體,bolder稍粗,如圖所示,我們可以根據需要設置不同的字體粗細。

html網頁設計字體設置方式 第5張

(04)使用font-size設置字體大小,在css文件上輸入font-size之後系統會自動顯示我們可以選擇的大小,large,larger等等,我們也可以直接輸入數字來定義字體的大小。

html網頁設計字體設置方式 第6張
html網頁設計字體設置方式 第7張

(05)font-family定義字體樣式,如楷體,黑體,宋體等等,這樣可以設置文字的顯示樣式,也可以在後面設置多種字體,作為備用字體。

html網頁設計字體設置方式 第8張
html網頁設計字體設置方式 第9張

(06)在輸入文本的時候,行與行之間的距離也可以自己定義,使用line-height定義一段文字的行高,這樣行與行之間的距離就可以拉開,設計出更好的顯示格式。

html網頁設計字體設置方式 第10張
標籤: HTML 網頁 字體 設置
  • 文章版權屬於文章作者所有,轉載請註明 https://miaozhigu.com/zclc/jiuye/oe2kg.html