软件测试体系学习及构建（7）-HTML之文本格式化、链接、头部、CSS

（7）-HTML之文本格式化、链接、头部、CSS

1 文本格式化
- 1.1 文本格式化标签
- 1.2 举例
2 链接
- 2.1 链接标签
- 2.2 链接语法
- 2.3 链接属性
- 2.4 举例
3 头部
- 3.1 head元素
- 3.2 title元素
- 3.3 base元素
- 3.4 style元素
- 3.5 link 元素
- 3.6 meta元素
- 3.7 script元素
4 CSS
- 4.1 内联样式
- 4.2 内部样式表
- 4.3 外部样式表

1 文本格式化 1.1 文本格式化标签

使用某些标签对文本进行格式化，如加粗、倾斜等，这类标签即称为文本格式化标签。
如下常用的文本格式化标签有：

标签	说明
	定义粗体文本
	定义着重文字
	定义斜体字
	定义小号字
	定义加重语气
	定义下标字
	定义上标字
	定义插入字
	定义删除字

1.2 举例

文本格式化标签 【这是规则】
这是 定义粗体文本 的标签！
这是 定义着重文字 的标签！
这是 定义斜体字 的标签！
这是定义小号字的标签！
这是 定义加重语气 的标签！
这是_{定义下标字} 的标签！
这是^{定义上标字} 的标签！
这是定义插入字的标签！
这是 ~~定义删除字~~ 的标签！

【这是举例】

曾经有一份真挚的爱情摆在我的面前

我没有好好珍惜 等到失去时 才感到后悔

如果老天能够再^{给我一次机会}

我会对那个女孩说 我爱你

如果非要在这个爱上_{加个期限的话}

我希望是 ~~一万年~~

2 链接

使用标签来设置超文本链接;
超链接可以是一个字，一个词，或者一组词，也可以是一幅图像;
以点击这些内容来跳转到新的文档或者当前文档中的某个部分;
在标签中使用了href属性来描述链接的地址。

2.1 链接标签

使用标签来表示超文本链接；
使用href属性描述链接地址。

2.2 链接语法

链接文本

2.3 链接属性

属性	说明
	链接地址
	定义被链接的文档在何处显示
	创建一个 HTML 文档书签

2.4 举例

链接学习

在当前标签中打开网页

NoamaNelson的CSND博客
NoamaNelson的博客园

在新的窗口中打开网页

NoamaNelson的CSND博客
NoamaNelson的博客园

id属性

NoamaNelson的博客有：

CSND博客
博客园博客

创建图片链接(有边框)：

创建图片链接(无边框)：

3 头部 3.1 head元素

元素包含了所有的头部标签元素；
元素中可插入脚本（scripts）, 样式文件（CSS），及各种meta信息；
可添加在头部区域的元素标签有：

, <style>, <meta>, <link>, <script>, <noscript> ,<base>
</pre> 
3.2 title元素 
<ul><li><title>定义文档标题；</li><li>文档中是必须有的；</li><li>应用：</li></ul> 
<blockquote> 
 <p>①浏览器工具栏的标题；<br /> ②收藏夹中的标题；<br /> ③搜索引擎结果页面的标题。</p> 
</blockquote> 
<ul><li>举例：</li></ul> 
<pre class='brush:php;toolbar:false'><!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>标题学习
    

    
        什么都没有！！！

3.3 base元素

描述基本的链接地址/链接目标;
该标签作为HTML文档中所有的链接标签的默认链接；
举例：

3.4 style元素

定义了HTML文档的样式文件引用地址；
元素中你也可以直接添加样式来渲染 HTML 文档。
举例：

3.5 link 元素

定义文档与外部资源之间的关系；
通常用于链接到样式表；
举例：


body {background-color: rgb(170, 80, 255);}
a {color: darkblue;}

3.6 meta元素

标签描述了一些基本的元数据;
常用于指定网页的描述，关键词，文件的最后修改时间，作者，和其他元数据;
一般放置于区域；
元数据可使用于浏览器，搜索引擎）等。
举例：



    
        
        
        
        头部学习

        
        background-color: coral;}
        a {color: darkblue;} -->
        

        



    

    
        
        
        "#base">CSDN博客

3.7 script元素