HTML
WEB标准
结构(html)、表现(css)、行为(javaScript)
基本结构标签
<!DOCTYPE html>
<html lang="en">
<head>
<title>标题</title>
<meta charset="utf-8">
</head>
<body>
网站内容
</body>
</html>
<!DOCTYPE html>
文档类型声明标签
lang
当前文档的显示语言 en英文 zh-CN中文
<meta charset="utf-8">
定义字符集 不写容易乱码
标签属性
标签属性是指标签的特性
class 为html元素定义一个或多个类名(classname)(类名从样式文件引入)
id 定义元素的唯一id
style 规定元素的行内样式(inline style)
title 描述了元素的额外信息 (作为工具条使用)
HTML常用标签
<h1>-<h6>
标题标签 <p></p>
段落标签 <br />
换行标签
<div></div>
定义了文档的区域,块级 (block-level) 独占一行 <span></span>
用来组合文档中的行内元素, 内联元素(inline)
<img src="" alt="">
图像标签 src是该标签的必须属性 <a href="" target="目标窗口的弹出方式" ></a>
超链接标签 target属性 "_self"在当前窗口打开 "_blank"在新窗口打开
文本格式化标签
<strong></strong>
and<b></b>
文本加粗标签<em></em>
and<i></i>
文本倾斜<del></del>
and<s></s>
删除线<ins></ins>
and<u></u>
下划线
表格标签
<!--表格-->
<table align="center" border="1px" cellspacing="0">
<!-- 表格头部区域 -->
<thead>
<!--行-->
<tr>
<!--表头单元格 会居中 加粗-->
<th> dd </th>
<th> aa </th>
<th> cc </th>
</tr>
</thead>
<!-- 表格主体区域 -->
<tbody>
<tr>
<!--列-->
<td> d1 </td>
<td> a1 </td>
<td> c1 </td>
</tr>
</tbody>
</table>
单元格的合并
属性:
colspan跨列合并
rowspan跨行合并单元格
列表
<!-- 定义无序列表 -->
<ul>
<!-- 每个元素 -->
<li></li>
<li></li>
</ul>
<!-- 定义有序列表 -->
<ol>
<li></li>
<li></li>
</ol>
<!-- 自定义列表 -->
<dl>
<!-- 标题 -->
<dt>名词</dt>
<!-- 内容 -->
<dd>解释</dd>
<dd>解释</dd>
<dd>解释</dd>
</dl>
表单
表单标签
`<form></form>`
属性:
method
action
<input>
属性:
Type: 类型
Type 的值所代表的效果
- text:文本与<datalist>连用
- password:输入的数据不可见
range:调节条形
属性:min:设置最小值 * max:设置最大值 * step:设置单步调节大小 * value:设置初始位置
- number:设置数字输入框
- checkbox: 勾选框
- radio:复选框
- email:输入电子邮箱格式的数据
- tel:输入电话的数据
- url:输入url格式的数据
- date:获取时间
- color:获取颜色
image:图标按钮
file:上传文件
特有属性:*multiple:一次允许上传多个文件* *required:必须上传一个文件*
- hidden:隐藏表单 会提交
- submit:提交按钮
- button:普通按钮
- name:名字
- value:设置与填充 值
- placeholder: 设置与填充或叫提示
- maxlength: 设置最大数据长度
- size: 设置输入框长度
- readonly:只读效果
- list:链接
<textarea></textarea>
长表单
属性:
- rows:设置行数
- cols:设置长度
<select></select>
文本选择 <option></option>
选项 <datalist></datalist>