网站首页 > 教程分享 正文
HTML元素的基本结构
HTML元素通常由开始标签、内容和结束标签组成。基本结构如下:
<标签名>内容</标签名>
例如,一个段落元素:
<p>这是一个段落。</p>
常见的HTML元素
文档结构元素
<!DOCTYPE html>: 声明文档类型,告知浏览器使用HTML5标准。
<html>: 根元素,包含整个HTML文档。
<head>: 包含文档的元数据(如标题、样式、脚本等)。
<title>: 定义文档的标题,显示在浏览器标签上。
<body>: 包含网页的可见内容。
<!DOCTYPE html>
<html>
<head>
<title>我的网页</title>
</head>
<body>
<h1>欢迎来到我的网页</h1>
</body>
</html>
文本内容元素
<h1>至<h6>: 标题元素,<h1>为最高级别,<h6>为最低级别。
<p>: 段落元素,用于定义文本段落。
<br>: 换行元素,不需要结束标签。
<hr>: 水平线元素,用于分隔内容。
<h1>这是主标题</h1>
<p>这是一个段落。</p>
<br>
<hr>
列表元素
<ul>: 无序列表,使用圆点标记。
<ol>: 有序列表,使用数字标记。
<li>: 列表项,必须在<ul>或<ol>内使用。
<ul>
<li>第一项</li>
<li>第二项</li>
</ul>
<ol>
<li>第一项</li>
<li>第二项</li>
</ol>
链接和图像元素
<a>: 超链接元素,使用href属性指定链接地址。
<img>: 图像元素,使用src属性指定图像路径,alt属性提供替代文本。
<a href="https://www.example.com">访问示例网站</a>
<img src="image.jpg" alt="示例图像">
表格元素
<table>: 表格元素。
<tr>: 表格行元素。
<td>: 表格单元格元素。
<th>: 表头单元格元素。
<table>
<tr>
<th>姓名</th>
<th>年龄</th>
</tr>
<tr>
<td>张三</td>
<td>25</td>
</tr>
</table>
表单元素
<form>: 表单元素,用于收集用户输入。
<input>: 输入元素,类型通过type属性指定(如text, password, submit等)。
<label>: 标签元素,关联输入元素。
<textarea>: 多行文本输入元素。
<form action="/submit" method="post">
<label for="name">姓名:</label>
<input type="text" id="name" name="name">
<input type="submit" value="提交">
</form>
猜你喜欢
- 2025-05-02 HTML5学习笔记四:html5新增标签、语义特性-文档声明
- 2025-05-02 XSS之编码(解决xss问题,一般用什么方法编码)
- 2025-05-02 HTML中JavaScript链接的href值选择
- 2025-05-02 前端加薪必备:掌握这10个HTML标签,让您的网页SEO排名飞升!
- 2025-05-02 PC网站建设必备代码知识:HTML基础与应用技巧
- 2025-05-02 HTML-列表标签(双标签) 208(html三种列表标签)
- 2025-05-02 HTML中图像标签img(html图像标签有哪些)
- 2025-05-02 HTML页面中head标签有啥用?——零基础自学网页制作
- 2025-05-02 企业网站建设的小细节:H标签(网站标签的作用)
- 2025-05-02 那些容易被你忽略的HTML重要属性,你知道几个?
你 发表评论:
欢迎- 最近发表
- 标签列表
-
- css导航条 (66)
- sqlinsert (63)
- js提交表单 (60)
- param (62)
- parentelement (65)
- jquery分享 (62)
- check约束 (64)
- curl_init (68)
- sql if语句 (69)
- import (66)
- chmod文件夹 (71)
- clearinterval (71)
- pythonrange (62)
- 数组长度 (61)
- javafx (59)
- 全局消息钩子 (64)
- sort排序 (62)
- jdbc (69)
- php网页源码 (59)
- assert h (69)
- httpclientjar (60)
- postgresql conf (59)
- winform开发 (59)
- mysql数字类型 (71)
- drawimage (61)
本文暂时没有评论,来添加一个吧(●'◡'●)