- 标签 <标签名> :标记语言(HTML, XML)
- HTML文件的结构
1.1在开头用<!DOCTYPE html>来声明 HTML5
1.2所有内容包含在<HTML></HTML>标签中
1.3在html标签中先有<head></head>标签
1.4要显示的内容写在<body></body>标签
1.5注释一般在一段代码的开始和结束都要加
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<mate charset="utf-8"> # 中文要设置此项
<title>要显示的内容</title>
</head>
<body>
</body>
</html>
- <style></style> 定义内部样式表
- <script></script> 定义JS代码或引入外部JS文件
- <link/> 引入外部样式表文件
- <meta/> 定义网页原信息,可以定义关键字
<meta name = "keywords" content="meta 总结"> # 关键字 百度爬虫
<meta name = "description" content = "要描述的内容"> # 描述
<meta http-equiv = "refresh" content = "2;URL= http://xxxxx"> # 两秒之后跳转
<meta http-equiv = "x-ua-compatible" content = "IE=edge"> # 告诉IE已最高模式渲染
- 其他标签
用 = 复制的是属性, 任何标签都有三个固定属性, id,class,style
- <h1></h1> -- <h6></h6> 标题标签
- <img scr = "路径" alt = "没有图片时的提示信息" title = "鼠标悬停时的提示"> 图片标签
- <a herf = "要跳转的地方" target = "_blank">要显示的内容</a> # target="_blank" 可以从新标签页打开,默认为当前页打开。可以设置跳转连接,其他网页或者当前页面设置的其他标签。
- <b></b> 加粗标签
- <i></i> 斜体标签
- <u></u> 下划线
- <s></s> 删除线
- <p></p> 段落标签
- <br /> 换行标签
- <hr /> 水平线
- <div></div> 单独显示,不在一行
- <span></span> 多个span在一行显示
- 列表标签
13.1 无序列表, type属性 disc 实心圆点,circle 空心圆,square 实心方块,none 无样式
<ul>
<li>列表 </li>
</ul>
13.2 有序列表,type属性控制序号 1、A、a、I,start 起始值
<ol type = "I", start = "3">
<li>列表</li>
</ol>
13.3 标题列表,
<dl>
<dt>标题</dt>
<dd>内容</dd>
<dl>
- 表格 broder 边框像素, cellpadding 内边距,cellspacing 外边距,width 像素百分比, rowspan 单元格列合并,colspan 行合并。
<table>
<thead> # 表格标题
<tr> # 表格一行
<th>姓名</th> # 表格一列
<th>年龄</th>
<th>爱好</th>
</tr>
</thead>
<tbody> # 表体
<tr>
<th>小强</th>
<th>29</th>
<th>干啥</th>
</tr>
</tbody>
</table>
- 标签分类
- 块儿级标签,独占一行
默认占浏览器的宽度,能设置长和宽 - 内联标签(行内标签)
根据内容决定长度,不能设置长和宽
- 标签嵌套规则
- 行内标签不能嵌到块级标签
- p标签不能嵌套块级标签
- 常用特殊符号
< # 小于号
> # 大于号
© # 版权符号
# 空格
& # &符号
¥ # 人民币符号
® # 注册符号
- form 表单相关内容
前后端有数据交互的时候用form表单
- 所有提交的数据在表单中
- form 中的 action= 对应到后端要提交的地址, method 对应请求方式get post。有文件上传时需要post方式,并且修改属性enctype="multipart/from-data"。disabled 禁用
- 使用键值对形式提交,标签外是提示性文本可以用中文,标签内用英文为宜
- input\select\textarea 都需要有name属性,为后端的键,标签外是提示信息
- 必须有提交按钮
- input 常用tpye属性:
- text 文本
1.1 value 设置默认值
1.2 readonly 设置只读 - password 密码
- radio 单选
- checkbox 多选
- date 日期
- datetime 时间
- file 文件
- button 普通按钮,多用js绑定事件
- reset 重置
- submit 提交
- textarea 大段文本
- select 下拉菜单
12.1 option 具体的下拉选项
12.2 optgroup 分组的下拉选项
12.3 multiple 可以多选的下拉框
12.4 selected 默认选项 - email 邮箱
- hidden 隐藏标签
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset = "utf-8">
<title>form 表单</title>
</head>
<form action=""> # form 配合input标签使用 input需要有name 以便后端取值, value 为提交时所带的值
<p> # 使用p标签单独起一行
<input name = “username ”type="text"> # type = “text” 出现输入框 ,name 为后端取数据的键
</p>
<p> # 使用p标签单独起一行
<input type="password"> # type = “password” 出现密码输入框
</p>
<p>性别: # 使用p标签单独起一行
<input name = “gender” type="radio" value = "1"> 男 # type = “radio” 选择按钮
<input name = “gender” type="radio" value = "0"> 女 # type = “radio” 选择按钮
</p>
<p> 爱好:
<input name="hobby" type="checkbox" value="hobby1"> 爱好1 # type = “checkbox” 选择按钮
<input name="hobby" type="checkbox" value="hobby2"> 爱好2 # type = “checkbox” 选择按钮
<input name="hobby" type="checkbox" value="hobby3"> 爱好3 # type = “checkbox” 选择按钮 ,这里为一组
</p>
<p> 来自哪里:
<select name="" id=""> # 选择菜单
<optgroup label = "北京"> # 一级菜单
<option value="">朝阳</option> # 二级菜单
<option value="">顺义</option>
<option value="">昌平</option>
</optgroup>
<option value="">上海</option>
<option value="">山东</option>
</select>
</p>
<p>
<textarea name = "info" id="" cols="" rows=""> # 大文本区域
</textarea>
</p>
<p>
<input type="file"> #上传文件的标签
</p>
<p>生日:
<input name = "birthday" type ="data">
</p>
<input type= "submit" value = “提交”> # type = "submit" 出现提交按钮 ,value 控制按钮名字
<input type = "reset" value="reset"> # 重置按钮
<input type="button" value="button"> # 普通按钮
<body>
<\body>
网友评论