分享

HTML入门

 印度阿三17 2020-12-29

HTML入门

1_HTML结构

<!DOCTYPE html><!--文档声明,表示这是一个HTML页面-->
<html>
<head>
    <meta charset="utf-8" />
    <title>这是网页的标题</title>
</head>
<body>

</body>
</html>

1.1_head标签

在HTML中,一般来说,只有6个标签能放在head标签内。
(1)title标签
(2)meta标签
(3)link标签
(4)style标签
(5)script标签
(6)base标签

1.1.1_meta标签

在HTML中,meta标签有两个重要的属性:name和http-equiv
1. name属性

表1 name属性取值

属性值说明
keywords网页的关键字,可以是多个,而不仅仅是一个
description网页的描述
authorauthor
copyright版权信息

举例:

<!DOCTYPE html>
<html>
<head>
    <!--网页关键字-->
    <meta  name="keywords" content="绿叶学习网,前端开发,后端开发"/>
    <!--网页描述-->
    <meta  name="description" content="绿叶学习网是一个最富有活力的Web技术学习网站"/>
    <!--本页作者-->
    <meta  name="author" content="helicopter">
    <!--版权声明-->
    <meta  name="copyright" content="本站所有教程均为原创,版权所有,禁止转载。否则必将追究法律责任。"/>
</head>
<body>
</body>
</html>

2. http-equiv属性
在HTML中,meta标签的http-equiv属性只有两个重要作用定义网页所使用的编码定义网页自动刷新跳转

(1)定义网页所使用的的编码
语法:
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
而在HTML5标准可以替换为:
<meta charset="utf-8" />


(2)定义网页自动刷新跳转
语法:
<meta http-equiv="refresh" content="6;url=http://www.baidu.com"/>
表示当前页面在6秒后会自动跳转到http://www.baidu.com这个页面

2_文本

2.1_标题、段落、换行、文本、水平线、div标签

1. 标题标签

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>标题标签</title>
</head>
<body>
    <h1 align="center">这是一级标题</h1><!--align="center"使得标题居中-->
    <h2>这是二级标题</h2>
    <h3>这是三级标题</h3>
    <h4>这是四级标题</h4>
    <h5>这是五级标题</h5>
    <h6>这是六级标题</h6>
</body>
</html>

在这里插入图片描述
2. 段落标签

<p>段落内容</p>

3. 换行标签
自闭合标签

<br/>

4. 文本标签

在HTML中,我们可以使用“文本标签”来对文字进行修饰,例如粗体、斜体、上标、下标等。常用的有8种文本标签。

(1)粗体标签:strong、b
(2)斜体标签:i、em、cite(最好用em)
(3)上标标签:sup
(4)下标标签:sub
(5)中划线标签:s
(6)下划线标签:u
(7)大字号标签:big
(8)小字号标签:small

5. 水平线标签

<hr/>

6. div标签

在HTML中,我们可以使用“div标签”来划分HTML结构,从而配合CSS来整体控制某一块的样式

<!DOCTYPE html> 
<html>
<head>
    <meta charset="utf-8" />
    <title>div标签</title>
</head>
<body>
    <!--这是第一首诗-->
    <div>
        <h3>静夜思</h3>                  
        <p>床前明月光,疑是地上霜。</p>
        <p>举头望明月,低头思故乡。</p>
    </div>
    <hr/>
    <!--这是第二首诗-->
    <div>
        <h3>春晓</h3>                  
        <p>春眠不觉晓,处处闻啼鸟。</p>
        <p>夜来风雨声,花落知多少。</p>
    </div>
</body>
</html>

2.2_特殊符号

空格符号nbsp
特殊符号使用格式: 
其他符号见此链接

来源:https://www./content-4-802801.html

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多