整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
1）字体的属性
字体属性用于定义字体的类型、字号大小、加粗、斜体等方面样式。常用的字体属性如下表所示：
属 性 | 可 取 值 | 描 述 |
font | font-style、font-variant、font-weight、font-size（或 line-height）、font-family | 在一个声明中设置所有的字体属性 |
font-family | 字体名称、inherit | 设置字体类型 |
font-size | xx-small、x-small、small、medium（默认）、large、x-large、xx-large smaller、larger length、%、inherit | 设置字体大小 |
font-weight | normal（默认）、bold、bolder、lighter、inherit 100、200…900（400=normal，700=bold） | 设置字体粗细 |
font-style | normal、italic、oblique、inherit | 设置字体风格 |
例子，
<!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 前端技术</h3>
<span
>在当今社会中，Web 已经成为网络信息共享和发布的主要形式。要想开发 Web 应用
系统，就必须掌握 Web 前端技术。</span
>
</body>
</html>显示为，
（2）CSS 中链接标签可用的伪类：
CSS 中，伪类是添加到选择器的关键字，给指定元素设置一些特殊状态，我们以 : 开头。
链接有以下四个状态。这四种状态也称之为超链接的伪类。
状态 | 效果 |
a:link | 普通的、未被访问的链接。 |
a:hover | 鼠标指针位于链接的上方。 |
a:active | 链接被单击的时刻。 |
a:visited | 用户已访问的链接。 |
针对超链接的上述四种状态设置样式规则，能起到美化超链接的作用。例如，为了完成下对超链接的显示要求，编写的 CSS 样式代码如下。
状 态 | 颜 色 | 背 景 色 | 文 本 修 饰 |
未访问 | 蓝色 | 无 | 无下画线 |
鼠标移到 | 黑色 | #DDDDDD | 下画线 |
正单击 | 红色 | #AAAAAA | 删除线 |
已访问 | 绿色 | 无 | 无下画线 |
对于超链接的伪类，我们推荐的使用顺序是：: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="#">这是一个链接</a>
</body>
</html>
显示为，
为什么要按照这样的顺序来使用呢？ 调整几个伪类的顺序，看看会发生什么。
我们把 a:link 放到最后，效果如下：
从图中可以发现其中的样式属性都被覆盖了。
（3）列表相关的样式属性：
属 性 | 可 取 值 | 描 述 |
list-style | list-style-type、list-style-position、list-style-image | 在一个声明中设置所有的列表属性 |
list-style-image | URL、none | 设置图像为列表项标志 |
list-style-position | inside、outside、inherit | 设置列表中列表项标志的位置 |
list-style-type | disc（默认）、circle、square、decimal 等 | 设置列表项标志的类型 |
例子，
wget https://labfile.oss.aliyuncs.com/courses/2841/list.gif、 设置字体样式的基本标签是<font></font>，被其包含的文本为样式作用区。在初学者的HTML代码编写中，<font></font>容易被多重嵌套，如<font 属性1=值1><font 属性2=值2>文本</font></font>。还有一种情况是标签嵌套错位，如<font><p>文本</font></p>。为了规范代码的编写，避免不必要的错误，读者在初学时一定要谨慎。
2、设置文字的颜色 color 是标签的属性之一，用于设置文字颜色。color是<font></font>标签的属性之一，用于设置文字颜色。例子如：浅红色文字：<font color="#dd0000">51UM博客即汤汤个人博客网站，是一个和草根站长们一起学习分享网站SEO优化技术、web前端开发为主的个人博客网站。</font>
3、设置文字的尺寸 size 也是标签的属性，用于设置文字大小。size 的值为1-7， 默认为3。我们可以 size 属性值之前加上“+”“-”字符，来指定相对于字 、 号初始值的增量或减量。例子如： size为1：<font size="-2">HTML学习</font>
4、使文字倾斜，用双标签<i></i>可使被作用文字倾斜，达到特殊的效果，例如文章的日期。<em></em>被称为强调标签，也是斜体，目前使用比<i></i>标签更频繁，其编写方法如下：
<i>这是斜体文字</i>
<em>这也是斜体文字</em>
5、 使文字加粗，用双标签<b></b>可使被作用文字加粗，是文字更加醒目，例如文章的标题部分。<strong></strong>被称为特别强调标签，也是文字加粗，目前使用比<b></b>标签更频繁，其编写方法如下：
<b>这是粗体文字</b>
<strong>这也是粗体文字</strong>
除注明外的文章,均为来源：汤久生博客(QQ:1917843637),转载请保留本文地址，谢谢！
、成品效果
2、源码：利用 网页抬头、标题标签、段落标签、水平线、换行、字体加粗
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!--网页抬头-->
<title>中央气象局</title>
</head>
<body>
<!--大标题-->
<h2>中央气象台发布暴雨蓝色预警 北京地区局部地区有大雨</h2>
<p>
<!-- 二标题 -->
<h5>2021-08-07 21:00 来源：中国新闻网</h5>
<hr>
<!-- 三标题 -->
<h4>(原标题：中央气象台发布暴雨蓝色预警)</h4>
<!-- 四标题 -->
<h4>中新网8月07日电 中央气象台8月07日发布暴雨蓝色预警！</h4>
<!--正文 ↓-->
<p>
<strong>北京市气象台7日6时发布北京地区天气预报：</strong>今天白天晴间多云，北转南风二三级，
<em>最高气温33℃；夜间晴转多云，</em>南转北风一二级，最低气温23℃。今日是立秋节气。
双休日气温较高，湿度大，体感闷热，户外注意防暑降温勤补水。<ins>地质灾害风险较高，
请避免前往河道、山区游玩。</ins>周日夜间将有雷阵雨天气，请及时关注临近预报。
</body>
</html>
*请认真填写需求信息，我们会在24小时内与您取得联系。
