HTML知识梳理
2021-10-28 15:00:12 1 举报AI智能生成
HTML使用脉络，请收藏，持续更新
作者其他创作
大纲/内容
标签骨架
文件开头 <!DOCTYPE html>
html表示使用最新html规范
语言
参考资料
网页头部的声明应该是用 lang="zh" 还是 lang="zh-cn"？
正式结构 - <html lang="zh-CN"> - 语言
<head>
字符集 <meta charset="UTF-8">
chartset与lang
<title>
<body>
</html>
HTML概念与补充
语义化
路径
注释
标签种类
常见单标签
<br />
<hr />
<meta />
<input />
单标签格式问题
双标签
标签关系
嵌套关系与并列关系
多媒体标签
文字标签
标题标签、段落、水平线与换行标签
<h1> ~ <h6>
<p>
<hr>
<br />
div和span
没有语义，用于CSS
文本格式化标签
加粗强调
<strong>
斜体
<em>
加删除线
<del>
加下划线
<ins>
图像标签
<img />
单标签
看到到这里标签开始有属性了！
一般不给高度让它等比例缩放，自己掌握不好定量数值，只给个宽度就行
链接标签
<a></a>
anchor的缩写
使用方式就是用a将要跳转的文字包裹起来
属性
href
外部链接
内部链接
空链接
#
可以链接图像、表格、音频、视频等等
target
默认值：self
新窗口打开：blank
数据与排版
表格
一拿到大量数据，就想到用表格展现
用来显示数据，非常规整，可读性好
原来用来布局，但是很坑
原来用来布局，但是很坑
<table>
<caption> - 表格标题
<tr> - 行
<th> - 表头单元格
<tr> - 行
<td> - 单元格
合并单元格三部曲
01 确定跨行还是跨列合并
02 找目标单元格 - 从上往下，从左到右
03 写下rowspan或colspan属性
删除多余单元格
删除多余单元格
表格属性
列表
表格显示数据，列表用来布局！
去掉了行的表格
无序列表
<ul>
<li>
有序列表
<ol>
<li>
自定义列表
用于对术语或名词进行解释
<dl>
<dt>
<dd>
表单
参考资料
HTML 表单和输入
【Html】在表单（input）中id和name的区别
HTML创建表单时label标签怎么使用
表单控件
<input>
常用属性
radio
<label>
<textarea>
<select>
节约空间
<option>
不同浏览器展示不一样，很难修改样式，用得少了
现在基本是用div+ul模拟出来的
现在基本是用div+ul模拟出来的
提示信息
表单域
实例
<form action="demo_form.php">
<label for="male">Male</label>
<input type="radio" name="sex" id="male" value="male"><br>
<label for="female">Female</label>
<input type="radio" name="sex" id="female" value="female"><br><br>
<div align="center"><input type="submit" value="提交查询内容"></div>
</form>
<label for="male">Male</label>
<input type="radio" name="sex" id="male" value="male"><br>
<label for="female">Female</label>
<input type="radio" name="sex" id="female" value="female"><br><br>
<div align="center"><input type="submit" value="提交查询内容"></div>
</form>
0 条评论
下一页
