三種不同類型的CSS樣式

1、首先，在電腦中打開編輯器，創(chuàng)建html文檔。

虎丘網(wǎng)站建設(shè)公司創(chuàng)新互聯(lián)建站,虎丘網(wǎng)站設(shè)計(jì)制作，有大型網(wǎng)站制作公司豐富經(jīng)驗(yàn)。已為虎丘1000+提供企業(yè)網(wǎng)站建設(shè)服務(wù)。企業(yè)網(wǎng)站搭建\成都外貿(mào)網(wǎng)站建設(shè)公司要多少錢，請(qǐng)找那個(gè)售后服務(wù)好的虎丘做網(wǎng)站的公司定做！

2、然后，創(chuàng)建h1標(biāo)簽，用行內(nèi)樣式控制字體顏色為紅色。

3、接下來，用內(nèi)部樣式選擇器選擇h1標(biāo)簽，控制它的樣式。

4、外部樣式需要，創(chuàng)建外部樣式.css文件。

5、然后，在html文件里面引入css文件。

6、最后，在瀏覽器看是否生效，就可以了。

css文件的格式

CSS是Cascading Style Sheet 的縮寫，譯作「層疊樣式表單」，是用于（增強(qiáng)）控制網(wǎng)頁(yè)樣式并允許將樣式信息與網(wǎng)頁(yè)內(nèi)容分離的一種標(biāo)記性語(yǔ)言。

css文件格式用HTML（標(biāo)準(zhǔn)通用標(biāo)記語(yǔ)言的一個(gè)應(yīng)用）或XML（標(biāo)準(zhǔn)通用標(biāo)記語(yǔ)言的一個(gè)子集）等文件樣式的計(jì)算機(jī)語(yǔ)言表示。

有三種方法可以在站點(diǎn)網(wǎng)頁(yè)上使用CSS：

1、外聯(lián)式Linking（也叫外部樣式）：將網(wǎng)頁(yè)鏈接到外部樣式表。

2、嵌入式Embedding（也叫內(nèi)頁(yè)樣式）：在網(wǎng)頁(yè)上創(chuàng)建嵌入的樣式表。

3、內(nèi)聯(lián)式Inline（也叫行內(nèi)樣式）：應(yīng)用內(nèi)嵌樣式到各個(gè)網(wǎng)頁(yè)元素。

怎么用CSS樣式使文本居中對(duì)齊？

text-align: center;水平居中

height:30px;line-height:30px;垂直居中

vertical-align:middle;垂直居中

td里面可以直接td valign="middle" align="center"

層疊樣式表(英文全稱：Cascading Style Sheets)是一種用來表現(xiàn)HTML（標(biāo)準(zhǔn)通用標(biāo)記語(yǔ)言的一個(gè)應(yīng)用）或XML（標(biāo)準(zhǔn)通用標(biāo)記語(yǔ)言的一個(gè)子集）等文件樣式的計(jì)算機(jī)語(yǔ)言。CSS不僅可以靜態(tài)地修飾網(wǎng)頁(yè)，還可以配合各種腳本語(yǔ)言動(dòng)態(tài)地對(duì)網(wǎng)頁(yè)各元素進(jìn)行格式化

CSS 能夠?qū)W(wǎng)頁(yè)中元素位置的排版進(jìn)行像素級(jí)精確控制，支持幾乎所有的字體字號(hào)樣式，擁有對(duì)網(wǎng)頁(yè)對(duì)象和模型樣式編輯的能力。

其實(shí)當(dāng)時(shí)在互聯(lián)網(wǎng)界已經(jīng)有過一些統(tǒng)一樣式表語(yǔ)言的建議了，但CSS是第一個(gè)含有“層疊”豐意的樣式表語(yǔ)言。在CSS中，一個(gè)文件的樣式可以從其他的樣式表中繼承。讀者在有些地方可以使用他自己更喜歡的樣式，在其他地方則繼承或“層疊”作者的樣式。這種層疊的方式使作者和讀者都可以靈活地加入自己的設(shè)計(jì)，混合每個(gè)人的愛好。

哈坤于1994年在芝加哥的一次會(huì)議上第一次提出了CSS的建議，1995年的www網(wǎng)絡(luò)會(huì)議上CSS又一次被提出，博斯演示了Argo瀏覽器支持CSS的例子，哈肯也展示了支持CSS的Arena瀏覽器。

CSS字體與文本樣式詳解

學(xué)習(xí)導(dǎo)航

1、css中的長(zhǎng)度與顏色

2、css中的文字屬性

3、css中的文本屬性

1、文字樣式屬性

font-family 字體屬性

作用：元素內(nèi)文字以什么字體來顯示

語(yǔ)法：font-family:[字體1],[字體2],[......];

說明：含空格字體名和中文，用英文引號(hào)（"）括起；多個(gè)字體用英文逗號(hào)隔開；引號(hào)嵌套，外使用雙引號(hào)，內(nèi)使用單引號(hào)。

font-size 文字大小

作用：元素內(nèi)文字大小

語(yǔ)法：font-size:絕對(duì)單單位，相相對(duì)單位

color 文字顏色

語(yǔ)法：顏色名|十六進(jìn)制|RGB

font-weight 文字粗細(xì)

語(yǔ)法：font-weight:normal 正常 | bold 加粗 | bolder 加粗 | lighter 細(xì)體 | 100-900

說明：默認(rèn)值：normal 400等同于normal,而700等同于bold

font-style 文字樣式

作用：為元素內(nèi)文字設(shè)置樣式

語(yǔ)法：font-style:normal 正常顯示 | italic 文字傾斜 | oblique 文字傾斜（基本不用）

font-variant 字體變形

作用：設(shè)置元素中文本為小型大寫字母

語(yǔ)法：font-variant:normal 正常顯示| small-caps 將英文大小寫字母調(diào)成為同寬

font 屬性簡(jiǎn)寫

語(yǔ)法：font:font-style font-variant ?font-weight font-size/line-height font-family;

說明：值之間空格隔開，注意書寫順序。

2、CSS文本樣式

text-align

作用：設(shè)置元素內(nèi)文本的水平對(duì)齊方式

語(yǔ)法：tex-align:left 左對(duì)齊?| right 右對(duì)齊 | center 居中對(duì)齊 | justify 兩端對(duì)齊

注意：該屬性對(duì)塊級(jí)元素設(shè)置有效

line-height

作用：設(shè)置元素中文本行高

語(yǔ)法：line-height:長(zhǎng)度值 | 百分比

說明：一行文字的高度，行高指文本行的基線間的距離

文字基線

注意：基線并不是漢字文字的下沿，看圖理解自行理解

行高和行距

行高：基線到基線的距離

行距：底線到頂線的距離

注意：看圖自行理解

行框和行內(nèi)框

注意：看圖自行理解

vertical-align

作用：設(shè)置元素內(nèi)容的垂直方式

語(yǔ)法：vertical-align:baseline | sub | super | top | text-top | middle | bottom | text-bottom |?長(zhǎng)度 | 百分比

注意：看圖自行理解

text-indent 首行縮進(jìn)

3、文本樣式屬性

text-transform:?capitzlize?首字母大寫 |?uppercase?字母大寫?|?lowercase? 字母小寫 |?none 正常

text-decoration:?underline?下劃線 |?overline 上劃線?|?line-through?刪除線 | none 正常

綜合實(shí)操案例

如果您覺得有用，記得在下方點(diǎn)贊、關(guān)注、留言，我會(huì)定期奉 上更多的驚喜哦，您的打賞支持才是我繼續(xù)努力的動(dòng)力，么么噠。

每日分享在學(xué)習(xí)過程中總結(jié)的學(xué)習(xí)經(jīng)驗(yàn)，學(xué)習(xí)筆記，筆試題，HTML，CSS，JavaScript，jQuery教程，Vue教程，PHP教程，TinkPHP教程等，望大家能以學(xué)習(xí)為目的，每天閱讀一篇文章，了解身邊的技術(shù)。陪有夢(mèng)想的人一起成長(zhǎng)！

CSS樣式文件中不能包括HTML標(biāo)記 對(duì)？

是的，css樣式文件一般用來寫css樣式語(yǔ)句，一般都是屬性+值的方式