html

最新推荐文章于 2024-11-11 23:47:26 发布

原创最新推荐文章于 2024-11-11 23:47:26 发布 · 340 阅读

0 ·

CC 4.0 BY-SA版权

前端学习专栏收录该内容

5 篇文章

订阅专栏

HTMl系列一

这篇文章主要介绍html的相关知识，包括介绍html的简介，html的相关标签。

第一部分 HTML的简介

1.1.HTML是什么

HTML（Hyper Text Markup Language）：是一种超文本标记语言，它非编程语言。

1.超文本：就是指页面中可以包含除了文本外的其他的内容，例如：图片，视频。
2.标记：就是指使用标签的方式将需要在页面展示的内容包括起来。例如：`<h1>标题一</h1>`

1.2.HTMl的语法规范：

1.HTML的文件是以.html或者.htm结尾的，
2.html文件主要由头部分<head></head>和主体部分<body></body>这两部分组成。
3.html的标签有两种：一种是单标签，例如：<img/>,<br/>;另一种是双标签：<p>xxxx</p>,<hn>xxxx</hn>...；一般双标签比单标签多。
4.html的标签是不区分大小写的。

1.3.HTML的作用

编写一个网页，就如同是搭建一个房子。其中的HTML的作用就是如同是将房子的主体框架给搭建好。HTML标签主要是展示需要显示的数据。

第二部分

2.1 排版标签

2.1.1 标题标签
    HTML提供<hn>系列标签，用于修饰标题（加粗加黑显示），包括：<h1>,<h2>,<h3>,<h4>,<h5>,<h6>.其中<h1>定义最大的标题，<h6>定义最小的标题。

2.1.2 水平线标签
    <hr />

2.1.3 文字标签
    <font> xxxx </font>
        字体标签的相关属性：
            1.color：设置文字的颜色。
            2.size：设置文字的大小，取值为1-7，逐级递增。
            3.face：设置文字的字体。

2.1.3 段落标签
    <p> xxxx </p>

2.1.4 加粗标签
    <b></b>
2.1.5 斜体标签
    <i></i>

例子：

```
<!DOCTYPE html>
        <html>
            <head>
                <meta charset="UTF-8">
                <title>标题标签</title>
            </head>
            <body>
                <h1>标题一</h1><br />
                <h2>标题二</h2><br />
                <!--水平线标签-->
                <hr />
                <h3>标题三</h3><br />
                <h4>标题四</h4><br />
                <h5>标题五</h5><br />
                <h6>标题六</h6><br />
                <font color="red">红色字体</font>
                <font size="5```

字体</font>
<font face="楷体">楷体</font>
</body>
</html>

2.2 图片标签

src：图片位置的相关属性
alt：图片无法显示的时候给出提示信息。
height：设置图片的高度。
width：设置图片的宽度。
src：
绝对位置：是相对于盘符的，例如：E:\博文\相关图片\1.jpg。
相对位置：是相对于某个文件，例如html文件。
1.如果是同级的话，就直接写文件名或者./文件名。
2.如果是上一级的话，就../文件名称（如果是多层，就多写几个../）。
3.如果是下一级的话，写目录名称/文件名称。