### HTML语言基础教程知识点概述 #### 一、HTML简介与基本概念 - **HTML全称**: HyperText Markup Language,即超文本标记语言。 - **作用**: - 实现页面之间的跳转。 - 展现多媒体的效果。 - **标签**: - HTML通过特定的标签来构建网页结构和内容。 - 单标签如`<br>`用于换行,无需闭合。 - 双标签如`<p>`和`</p>`,用于定义段落,需成对出现。 #### 二、HTML与XML的区别 - **HTML**: 用于控制页面显示。 - **XML**: 用于存储和交换数据。 #### 三、HTML的基本结构 - **文档头** (`<head>`): 包含关于文档的信息,如标题、链接样式表等。 - **文档体** (`<body>`): 显示在网页上的主要内容。 - **示例代码**: ```html <html> <head> <title>一个简单的HTML示例</title> </head> <body> <center> <h3>欢迎光临我的主页</h3> <br> <hr> <font size="2"> 这是我第一次做主页,无论怎么样,我都会努力做好! </font> </center> </body> </html> ``` #### 四、HTML标签详解 - **单标签**: - `<br>`: 换行。 - `<hr>`: 插入水平线。 - **双标签**: - `<em>`: 强调文字(通常显示为斜体)。 - `<p>`: 定义段落。 - **标签属性**: - `size`: 设置元素大小。 - `width`: 设置宽度。 - `align`: 设置对齐方式。 - `noshade`: 去除阴影效果。 #### 五、页面布局与文字设计 - **标题**: - 使用`<h1>`至`<h6>`标签,数字越小,标题越大。 - 示例: ```html <h1>一级标题</h1> <h2>二级标题</h2> ``` - **换行**: - 使用`<br>`标签进行手动换行。 - **段落**: - 使用`<p>`标签定义段落。 - 可设置对齐方式(`align`)为`left`、`right`或`center`。 - **水平线**: - 使用`<hr>`插入水平线。 - 可设置`size`、`width`、`align`以及`noshade`等属性。 - **文字大小**: - 使用`<font size="...">`调整文字大小。 - 尺寸范围通常是1到7。 - **文字字体与样式**: - 使用`<font face="...">`定义字体。 - 其他样式包括: - 粗体: `<b>`或`<strong>` - 斜体: `<i>`或`<em>` - 下划线: `<u>` - 打字机字体: `<tt>` - 大型字体: `<big>` - 小型字体: `<small>` - 闪烁效果: `<blink>` (不推荐使用) #### 六、综合示例 结合以上所学,创建一个简单的网页示例: ```html <html> <head> <title>示例页面</title> </head> <body> <h1 align="center">欢迎来到我的网站</h1> <hr width="50%" align="center" noshade> <p align="justify"> 这是一段示例文本,使用了段落标签<p>和对齐方式属性align。我们还可以添加一些<strong>粗体字</strong>和<i>斜体字</i>,以及<u>下划线</u>和<small>小字体</small>。 </p> </body> </html> ``` 通过本教程的学习,你可以掌握HTML的基础知识,并能够利用这些知识创建简单且具有基本样式的网页。随着学习的深入,你还可以探索更高级的HTML特性以及如何与其他Web技术(如CSS和JavaScript)相结合,来创建更加动态和交互性的网页。
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![application/octet-stream](https://img-home.csdnimg.cn/images/20210720083646.png)
![7z](https://img-home.csdnimg.cn/images/20210720083312.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![circ](https://img-home.csdnimg.cn/images/20210720083646.png)
![rar](https://img-home.csdnimg.cn/images/20210720083606.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![rar](https://img-home.csdnimg.cn/images/20210720083606.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![avatar-default](https://csdnimg.cn/release/downloadcmsfe/public/img/lazyLogo2.1882d7f4.png)
![avatar](https://profile-avatar.csdnimg.cn/default.jpg!1)
- 粉丝: 0
- 资源: 2
我的内容管理 展开
我的资源 快来上传第一个资源
我的收益
登录查看自己的收益我的积分 登录查看自己的积分
我的C币 登录后查看C币余额
我的收藏
我的下载
下载帮助
![voice](https://csdnimg.cn/release/downloadcmsfe/public/img/voice.245cc511.png)
![center-task](https://csdnimg.cn/release/downloadcmsfe/public/img/center-task.c2eda91a.png)
最新资源
![feedback](https://img-home.csdnimg.cn/images/20220527035711.png)
![feedback-tip](https://img-home.csdnimg.cn/images/20220527035111.png)
![dialog-icon](https://csdnimg.cn/release/downloadcmsfe/public/img/green-success.6a4acb44.png)