HTML CSS樣式 文字屬性

2021-08-21 11:00:28 字數 3168 閱讀 1583

什麼是css?

cascading style sheets,簡稱cs,層疊樣式表。

用來修飾html檔案,對網頁元素進行排版或大小控制等操作。

也就是說,html檔案填充了網頁的內容,而css則是控制內容的表現

例如:元素的大小,元素在網頁中的位置,元素的背景等屬性。

css**寫在那裡?

1 內聯樣式(行內式):

css**可以寫在html標籤中,使用style=「css樣式」;

這是乙個段落

2 內部樣式:

把css**寫在style標籤裡面

style標籤理論上寫在文件的任何位置都可以生效,但是我們都會把style寫在head標籤裡面

3 外部樣式:

外部樣式是把css**單獨寫在乙個css檔案(css字尾檔案)中

再使用link標籤把外部樣式檔案引入進來

外部樣式檔案中不需要style標籤,直接寫css**就可以了

三種樣式可以多種同時使用

##文字屬性 : font屬性

1字型大小:font-size

> 設定字型的大小,使用帶單位的值,例如px,em,pt等

font-size: 12px;
2字型顏色:color

color: red;

3字型樣式:font-family

設定字型,例如宋體、雅黑之類的

可以有多個值

但只顯示一種字型樣式

若第乙個字型可用就使用第乙個,否則使用第二個

若第二個字型也不可用,就是用第三個,以此類推

字型與字型之間用英文逗號隔開,如果是中文或多個單詞的值,要用英文雙引號包起來

font-family: "宋體",times,"new century schoolbook";
4字型粗細:font-weight

可選值說明normal

預設值,不加粗

bold

bolder

加粗,效果比bold更明顯

value

100900的不帶單位數值,一般100500為正常效果,600~900為加粗,數值越大,字型越粗

font-weight: bold;
5文字的大小寫: text-transform

可選值說明none

預設值,無效果

capitalize

首字母大寫

uppercase

全部大寫

lowercase

全部小寫

text-transform: capitalize;
6文字水平對齊方式:text-align

可選值說明left

預設值,左對齊

right

右對齊center

居中對齊

justify

兩端對齊

text-align: left;
7文字垂直對齊方式

可選值說明baseline

預設。元素放置在父元素的基線上

sub垂直對齊文字的下標

super

垂直對齊文字的上標

top把元素的頂端與行中最高元素的頂端對齊

text-top

把元素的頂端與父元素字型的頂端對齊

middle

把此元素放置在父元素的中部

bottom

把元素的頂端與行中最低的元素的頂端對齊

text-bottom

把元素的底端與父元素字型的底端對齊

inherit

規定應該從父元素繼承 vertical-align 屬性的值

只有元素屬於inline或是inline-block ,vertical-align屬性才會起作用。

vertical-align: baseline;
8文字劃線: text-decoration

可選值說明none

無下劃線

underline

下劃線overline

上劃線line-through

中間劃線(刪除線)

text-decoration: underline;
8首行縮排: text-indent

該屬性接受乙個帶單位的值

規定文字首行縮排多少個單位的空間

只對第一行有縮排,而且只用於塊元素

text-indent: 2em;
text-indent的屬性值一般會使用em作為單位,因為一般縮排都以多少個字元為標準

9字間距: letter-spacing

該屬性接受乙個帶單位的值

規定每個字元之間間隔多少個單位的空間

letter-spacing: 1em;
10詞間距: word-spacing

該屬性接受乙個帶單位的值

規定每個單詞之間間隔多少個單位的空間

該屬性對中文無效

HTML CSS的文字屬性,字型屬性,背景屬性

文字顏色 color 行高 line height 文字修飾 text decoration 屬性值 underline 下劃線 overline 上劃線 line through 中劃線 none 設定無 字元間距 letter spacing 單詞間距 word spcing hello wor...

CSS文字屬性 樣式及應用

color屬性用於定義文字的顏色,其取值方式有如下3種 預定義的顏色值,如red,green,blue等。十六進製制,如 ff0000,ff6600等,實際工作中,十六進製制是最常用的定義顏色的方式。rgb 如紅色可以表示為rgb 255,0,0 或rgb 100 0 0 需要注意的是,如果使用rg...

字型屬性 文字屬性

font family 微軟雅黑 字型 font size 16px 瀏覽器預設大小 16px 字型大小大小 font weight 400代表正常 700代表加粗 字型粗細 font style normal 預設正常 italic 斜體 文字樣式 字型復合屬性 順序 swsf font font...