HTML
标签可以说明文字、图形、动画、声音、表格、表单、连接等。列:<div> 内容</div>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div>
内容
</div>
</body>
</html>
< ! DOCTYPE html>: 这句话告诉浏览器当前页面时使用 HTML5 规范编写的,也是最新的 HTML 版本
html:所有标签元素都包含在 HTML元素中
head:标题头部 写一些默认配置信息
meta:
1. meta 标签是网页代码中 head 区的一个关键标签,提供信息用户不可见,但却是文档最基本的元信息
2. 同时也可以定义文档中的各种元数据,提供各种文档信息
3. chartset="UTF-8" 是meta 的一个属性,用于定义文档的字符编码 告知浏览器当前页面属于什么字符编码格式
4. 常见的编码有: gbk、unicode、utf-8
5. name="viewport" 这个是告知浏览器是这是属于移动端
6. content="width=device-width, initial-scale=1.0"
width=device-width:告知浏览器移动端页面的宽度等于设备宽
initial-scale=1.0 页面尺寸按原大小线上 如果是 2.0 就是放大两倍
借鉴:https://zhuanlan.zhihu.com/p/96427975
ctrl + / 快捷键快速注释、取消注释
<h1>h1</h1>
<h2>h2</h2>
<h3>h3</h3>
<h4>h4</h4>
<h5>h5</h5>
<h6>h6</h6>
<p>我是一个段落</p>
当内容过多时 会自动换行加粗: strong 标签 和 b 标签
倾斜: em 标签 和 i 标签
删除线: del 标签 和 s 标签
下划线: ins 标签 和 u 标签
<strong>加粗</strong><br/>
<em>倾斜</em><br/>
<del>删除线</del><br/>
<ins>下划线</ins>
<a href="跳转地址">超链接</a>
table 表示整个表格
tr 表示表格的一行
td 表示一个单元格
th 表示表头单元格,会居中加粗
thead 表格的头部区域 (注意和th的不同,在th的外层)
tbody 表格的主体区域
align 表格相对的周围元素的对其发生 align="center" 表示居中
border 表示边框默认为1 border="2" 数字越多边框越粗
cellpadding 内容距离边框的距离, 默认为1像素
cellspacing 单元格之间的距离,默认为2元素
width、height 设置尺寸
colspan 行合并
rowspan 列合并
form 标签
action 属性定义表单提交目标的url
method 定义提交数据的http方法 post/get
label 元素用于为表单元素添加标签,提高可访问性
input 表单元素 通过不同的type类型 创建文本
select 创建下拉列表 <option> 元素用于定义下拉列表中的选项</option>
input
text 文本输入框
<input type="text" name="name" />
password 密码框
<input type="password" name="password" />
radio 单选按钮
<input type="radio" name="sex" value="male" /> 男
<input type="radio" name="sex" value="femal" />女
checkbox 复选框
<input type="checkbox" name="vehicle" value="bike" />自行车
<input type="checkbox" name="vehice" value="car" />小汽车
submit 提交按钮
<input type="submit" name="submit" value="submit" />
button 普通按钮
reset 清空表单内容按钮
select 下拉菜单
<select name="名称" id="prov"> name 在form 表单中的名称
<option value="北京">北京</option>
<option value="上海">上海</option>
</select>
div:division的缩写 会像 p 标签一样独占一行
span: 不独占一行 宽度由内容撑开