整合營(yíng)銷服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
1）字體的屬性
字體屬性用于定義字體的類型、字號(hào)大小、加粗、斜體等方面樣式。常用的字體屬性如下表所示：
屬 性 | 可 取 值 | 描 述 |
font | font-style、font-variant、font-weight、font-size（或 line-height）、font-family | 在一個(gè)聲明中設(shè)置所有的字體屬性 |
font-family | 字體名稱、inherit | 設(shè)置字體類型 |
font-size | xx-small、x-small、small、medium（默認(rèn)）、large、x-large、xx-large smaller、larger length、%、inherit | 設(shè)置字體大小 |
font-weight | normal（默認(rèn)）、bold、bolder、lighter、inherit 100、200…900（400=normal，700=bold） | 設(shè)置字體粗細(xì) |
font-style | normal、italic、oblique、inherit | 設(shè)置字體風(fēng)格 |
例子，
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
h3 {
font-size: 20px;
font-family: 隸書;
line-height: 28px;
}
span {
font: italic 16px 華文彩云;
}
</style>
</head>
<body>
<h3>Web 前端技術(shù)</h3>
<span
>在當(dāng)今社會(huì)中，Web 已經(jīng)成為網(wǎng)絡(luò)信息共享和發(fā)布的主要形式。要想開(kāi)發(fā) Web 應(yīng)用
系統(tǒng)，就必須掌握 Web 前端技術(shù)。</span
>
</body>
</html>顯示為，
（2）CSS 中鏈接標(biāo)簽可用的偽類：
CSS 中，偽類是添加到選擇器的關(guān)鍵字，給指定元素設(shè)置一些特殊狀態(tài)，我們以 : 開(kāi)頭。
鏈接有以下四個(gè)狀態(tài)。這四種狀態(tài)也稱之為超鏈接的偽類。
狀態(tài) | 效果 |
a:link | 普通的、未被訪問(wèn)的鏈接。 |
a:hover | 鼠標(biāo)指針位于鏈接的上方。 |
a:active | 鏈接被單擊的時(shí)刻。 |
a:visited | 用戶已訪問(wèn)的鏈接。 |
針對(duì)超鏈接的上述四種狀態(tài)設(shè)置樣式規(guī)則，能起到美化超鏈接的作用。例如，為了完成下對(duì)超鏈接的顯示要求，編寫的 CSS 樣式代碼如下。
狀 態(tài) | 顏 色 | 背 景 色 | 文 本 修 飾 |
未訪問(wèn) | 藍(lán)色 | 無(wú) | 無(wú)下畫線 |
鼠標(biāo)移到 | 黑色 | #DDDDDD | 下畫線 |
正單擊 | 紅色 | #AAAAAA | 刪除線 |
已訪問(wèn) | 綠色 | 無(wú) | 無(wú)下畫線 |
對(duì)于超鏈接的偽類，我們推薦的使用順序是：:link - :visited - :hover - :active。
例子，
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
* {
text-decoration: none;
}
a:link {
color: red;
}
a:visited {
color: blue;
}
a:hover {
color: green;
}
a:active {
color: yellow;
}
</style>
</head>
<body>
<a href="#">這是一個(gè)鏈接</a>
</body>
</html>
顯示為，
為什么要按照這樣的順序來(lái)使用呢？ 調(diào)整幾個(gè)偽類的順序，看看會(huì)發(fā)生什么。
我們把 a:link 放到最后，效果如下：
從圖中可以發(fā)現(xiàn)其中的樣式屬性都被覆蓋了。
（3）列表相關(guān)的樣式屬性：
屬 性 | 可 取 值 | 描 述 |
list-style | list-style-type、list-style-position、list-style-image | 在一個(gè)聲明中設(shè)置所有的列表屬性 |
list-style-image | URL、none | 設(shè)置圖像為列表項(xiàng)標(biāo)志 |
list-style-position | inside、outside、inherit | 設(shè)置列表中列表項(xiàng)標(biāo)志的位置 |
list-style-type | disc（默認(rèn)）、circle、square、decimal 等 | 設(shè)置列表項(xiàng)標(biāo)志的類型 |
例子，
wget https://labfile.oss.aliyuncs.com/courses/2841/list.gif、 設(shè)置字體樣式的基本標(biāo)簽是<font></font>，被其包含的文本為樣式作用區(qū)。在初學(xué)者的HTML代碼編寫中，<font></font>容易被多重嵌套，如<font 屬性1=值1><font 屬性2=值2>文本</font></font>。還有一種情況是標(biāo)簽嵌套錯(cuò)位，如<font><p>文本</font></p>。為了規(guī)范代碼的編寫，避免不必要的錯(cuò)誤，讀者在初學(xué)時(shí)一定要謹(jǐn)慎。
2、設(shè)置文字的顏色 color 是標(biāo)簽的屬性之一，用于設(shè)置文字顏色。color是<font></font>標(biāo)簽的屬性之一，用于設(shè)置文字顏色。例子如：淺紅色文字：<font color="#dd0000">51UM博客即湯湯個(gè)人博客網(wǎng)站，是一個(gè)和草根站長(zhǎng)們一起學(xué)習(xí)分享網(wǎng)站SEO優(yōu)化技術(shù)、web前端開(kāi)發(fā)為主的個(gè)人博客網(wǎng)站。</font>
3、設(shè)置文字的尺寸 size 也是標(biāo)簽的屬性，用于設(shè)置文字大小。size 的值為1-7， 默認(rèn)為3。我們可以 size 屬性值之前加上“+”“-”字符，來(lái)指定相對(duì)于字 、 號(hào)初始值的增量或減量。例子如： size為1：<font size="-2">HTML學(xué)習(xí)</font>
4、使文字傾斜，用雙標(biāo)簽<i></i>可使被作用文字傾斜，達(dá)到特殊的效果，例如文章的日期。<em></em>被稱為強(qiáng)調(diào)標(biāo)簽，也是斜體，目前使用比<i></i>標(biāo)簽更頻繁，其編寫方法如下：
<i>這是斜體文字</i>
<em>這也是斜體文字</em>
5、 使文字加粗，用雙標(biāo)簽<b></b>可使被作用文字加粗，是文字更加醒目，例如文章的標(biāo)題部分。<strong></strong>被稱為特別強(qiáng)調(diào)標(biāo)簽，也是文字加粗，目前使用比<b></b>標(biāo)簽更頻繁，其編寫方法如下：
<b>這是粗體文字</b>
<strong>這也是粗體文字</strong>
除注明外的文章,均為來(lái)源：湯久生博客(QQ:1917843637),轉(zhuǎn)載請(qǐng)保留本文地址，謝謝！
、成品效果
2、源碼：利用 網(wǎng)頁(yè)抬頭、標(biāo)題標(biāo)簽、段落標(biāo)簽、水平線、換行、字體加粗
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!--網(wǎng)頁(yè)抬頭-->
<title>中央氣象局</title>
</head>
<body>
<!--大標(biāo)題-->
<h2>中央氣象臺(tái)發(fā)布暴雨藍(lán)色預(yù)警 北京地區(qū)局部地區(qū)有大雨</h2>
<p>
<!-- 二標(biāo)題 -->
<h5>2021-08-07 21:00 來(lái)源：中國(guó)新聞網(wǎng)</h5>
<hr>
<!-- 三標(biāo)題 -->
<h4>(原標(biāo)題：中央氣象臺(tái)發(fā)布暴雨藍(lán)色預(yù)警)</h4>
<!-- 四標(biāo)題 -->
<h4>中新網(wǎng)8月07日電 中央氣象臺(tái)8月07日發(fā)布暴雨藍(lán)色預(yù)警！</h4>
<!--正文 ↓-->
<p>
<strong>北京市氣象臺(tái)7日6時(shí)發(fā)布北京地區(qū)天氣預(yù)報(bào)：</strong>今天白天晴間多云，北轉(zhuǎn)南風(fēng)二三級(jí)，
<em>最高氣溫33℃；夜間晴轉(zhuǎn)多云，</em>南轉(zhuǎn)北風(fēng)一二級(jí)，最低氣溫23℃。今日是立秋節(jié)氣。
雙休日氣溫較高，濕度大，體感悶熱，戶外注意防暑降溫勤補(bǔ)水。<ins>地質(zhì)災(zāi)害風(fēng)險(xiǎn)較高，
請(qǐng)避免前往河道、山區(qū)游玩。</ins>周日夜間將有雷陣雨天氣，請(qǐng)及時(shí)關(guān)注臨近預(yù)報(bào)。
</body>
</html>
*請(qǐng)認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。
