常用CSS樣式1:文字樣式
阿新 • • 發佈:2018-12-21
#css基本語法及頁面引用 ##css基本語法 css的定義方法是:
選擇器 { 屬性:值; 屬性:值; 屬性:值;}
選擇器是將樣式和頁面元素關聯起來的名稱,屬性是希望設定的樣式屬性每個屬性有一個或多個值。程式碼示例:
div{ width:100px; height:100px; color:red }
##css頁面引入方法: 1、外聯式:通過link標籤,連結到外部樣式表到頁面中。
<link rel="stylesheet" type="text/css" href="css/main.css">
2、嵌入式:通過style標籤,在網頁上建立嵌入的樣式表。
<style type="text/css"> div{ width:100px; height:100px; color:red } ...... </style>
3、內聯式:通過標籤的style屬性,在標籤上直接寫樣式。
<div style="width:100px; height:100px; color:red ">......</div>
##css文字設定 常用的應用文字的css樣式:
- color 設定文字的顏色,如:
color:red
; - font-size 設定文字的大小,如:
font-size:12px
; - font-family 設定文字的字型,如:
font-family:'微軟雅黑'
; - font-style 設定字型是否傾斜,如:
font-style:'normal'
;設定不傾斜,font-style:'italic'
- font-weight 設定文字是否加粗,如:
font-weight:bold
; 設定加粗font-weight:normal
設定不加粗 - font 同時設定文字的幾個屬性,寫的順序有相容問題,建議按照如下順序寫: font:是否加粗 字號/行高 字型;如:
font:normal 12px/36px '微軟雅黑'
; - line-height 設定文字的行高,如:
line-height:24px
; - text-decoration 設定文字的下劃線,如:
text-decoration:none
; 將文字下劃線去掉 - text-indent 設定文字首行縮排,如:
text-indent:24px
- text-align 設定文字水平對齊方式,如
text-align:center
設定文字水平居中
清華團隊帶你實戰區塊鏈開發 掃碼獲取海量視訊及原始碼 QQ群:721929980