代码拉取完成,页面将自动刷新
像上图中的:
这些都是标签, 像这样的标签有很多: HTML 参考手册- (HTML5 标准)
而HTML元素是指一个具体的标签实例, 比如下面有2个HTML元素,都是h标签
<h1>这是一个标题</h1>
<h1>这是另一个标题</h1>
而整个网页也就是是由这些标签组成的HTML元素嵌套组成
<tag att1=v1 attr2=v2>内容</tag>
每种标签都有自己的一组属性, 属性分为2类:
基础标签:
<h1> to <h6> 定义 HTML 标题
<p> 定义一个段落
<br> 定义简单的折行。
<hr> 定义水平线。
<!--...--> 定义一个注释
文本标签:
del 定义被删除文本。
i 定义斜体文本
ins 定义被插入文本
sub 下标文字
sup 上标文字
u 下划线文本
表单标签:
form
input
...
常见元素:
iframe 嵌套外部网页
img 展示图像
area 标签定义图像映射内部的区域: https://www.runoob.com/try/try.php?filename=tryhtml_areamap
a 链接标签
ul 定义一个无序列表
ol 定义一个有序列表
li 定义一个列表项
表格:
table 标签定义 HTML 表格, 一个 HTML 表格包括 <table> 元素,一个或多个 <tr>、<th> 以及 <td> 元素。
tr 元素定义表格行,
th 元素定义表头,
td 元素定义表格单元
容器元素
div 标签定义 HTML 文档中的一个分隔区块或者一个区域部分, 标签常用于组合块级元素,以便通过 CSS 来对这些元素进行格式化
span 用于对文档中的行内元素进行组合 标签提供了一种将文本的一部分或者文档的一部分独立出来的方式
标识该元素的唯一身份, 并且可以在其他地方引用
比如,通过a标题跳转到指定的位置:
<p>
<a href="#C4">查看章节 4</a>
</p>
<h2>章节 1</h2>
<p>这边显示该章节的内容……</p>
<h2>章节 2</h2>
<p>这边显示该章节的内容……</p>
<h2>章节 3</h2>
<p>这边显示该章节的内容……</p>
<h2><a id="C4">章节 4</a></h2>
<p>这边显示该章节的内容……</p>
id 也是js操作元素的重要依据之一:
document.getElementById('C4')
<a id="C4">章节 4</a>
通过元素的style属性可以控制该元素的样式
比如我们可以把p元素里面的这段话的字体加大, 演示改为红色
<p style="color:red;font-size:20px;">这边显示该章节的内容……</p>
语法的格式: key: value; 分号分开的就是一个样式条目, 我们可以为一个元素添加很多样式
再比如控制元素的宽和高
<iframe src="//www.runoob.com" sytle="height: 200px;width: 400px;">
<p>您的浏览器不支持 iframe 标签。</p>
</iframe>
一个元素的样式属性是有很多的 我们到css时再讲解
有了元素和样式,我们的页面还是一个静态页面, 比如页面加载完成后,我要动态修改里面的元素这么办?, 这就需要用到我们前面学的js脚本了
<script> 标签用于定义客户端脚本,比如 JavaScript
<script> 元素既可包含脚本语句,也可通过 src 属性指向外部脚本文件
比如下面:
// 通过src 网络引入
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14"></script>
// 通过本地文件引入
<script>
import axios from 'axios';
</script>
JavaScript 最常用于图片操作、表单验证以及内容动态更新
<script>
c4 = document.getElementById('C4')
// <a id="C4">章节 4</a>
c4.innerText
// '章节 4'
c4.innerText = '章节 5'
// '章节 5'
</script>
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。