这篇文章次要汇合了容易遗记的一些罕用的标签和属性.
1.文本格式化标签
| 标签 | 表头 |
|---|---|
<b> <strong> | 加粗 |
<i> <em> | 斜体 |
<s> <del> | 删除线 |
<u> <ins> | 下划线 |
img标签属性
| 属性 | 形容 |
|---|---|
src | 图像的门路 |
alt | 图片无奈显示时候替换文本 |
title | 鼠标悬停时显示的内容 |
border | 图片边框的高度 |
base标签
新建标签页关上链接页面,只需在head外面增加这段代码<base target=" blank">
罕用特殊字符
| 字符 | 形容 | 代码 |
|---|---|---|
| © | 版权 | © |
| & | 和 | & |
| 空格 | |
列表
无序列表 ul li
在一些导航布局当中也会常常用到
| 属性 | 后果 |
|---|---|
| list-style-type:circle; | |
| list-style-type:square; |
开发中咱们会常常革除ul li默认款式:
ul,li{ padding:0;margin:0;list-style:none}有序列表 ol li
CSS款式
| 属性 | 后果 |
|---|---|
| list-style-type:upper-roman; | |
| list-style-type:lower-alpha; |
自定义列表
<dl> <dt>hello</dt> <dd>hello world</dd> <dd>hello world</dd> <dd>hello world</dd> </dl>个别在footer底部介绍菜单分类中用的比拟多
表格
表格个别不用来布局，用来显示数据；
<table> <tr> <th>表头</th> ... </tr> <tr> <td>内容</td> ... </tr> ... </table>表格属性
| 属性名 | 含意 | 罕用属性值 |
|---|---|---|
| border | 边框 | 像素 |
| cellspacing | 单元格之间的空白间距 | 像素 |
| cellpadding | 单元格的内间距padding | 像素 |
| width | 宽度 | 像素 |
| height | 高度 | 像素 |
| align | 表格在网页中的程度对齐形式 | left center right |
表格构造
如果用表格进行布局，将表格划分为头部，主体和页脚
<thead></thead>:定义表格头部：个别蕴含logo和导航等信息
<tbody></tbody>：定义表格的主体
表格题目
<caption></caption会居中显示在表格上
合并单元格
跨行(竖着)：rowspan
跨列(横着)：colspan
input控件
| 属性 | 属性值 | 形容 |
|---|---|---|
| type | text | 文本 |
| type | password | 明码 |
| type | radio | 单选（input要是同一个name） |
| type | checkbox | 复选 |
| type | button | 按钮 |
| type | submit | 提交 |
| type | reset | 重置 |
| type | image | 图片按钮，配合src应用 |
| type | file | 文件域（上传文件） |
| name | 用户自定义 | 控件的名称 |
| value | 用户自定义 | input默认的文本值 |
| size | 正整数 | input控件的显示宽度 |
| checked | checked | 定义抉择控件默认被抉择的项 |
| maxlength | 正整数 | 容许输出的最多的字符 |
label标签
作用：绑定一个表单元素，当点击label标签的时候，被绑定的表单元素会获取输出焦点
<label for="male">男生</label> <input type="radio" id="male">textarea控件
<textarea cols="每行中的字符数" rows="显示行数"></textarea>下拉菜单
<select name="" id=""> <option value="">选项1</option> <option value="">选项2</option> <option value="" selected="selected">选项3</option> </select>selected="selected"用于设置默认选中的那项
表单域
在HTML中，form被用于定义表单域，实现收集传递用户信息，form中的所有内容都会被提交给服务器
<form action="url地址" method="提交办法" name="表单名称"></form>| 属性 | 作用 |
|---|---|
| action | 收集信息传递给服务器进行解决，action指定接管并解决表单数据的服务器程序的url地址 |
| method | 用于设置表单数据的提交形式，其取值为get和post |
| name | 名称 |
罕用新增标签
语义化标签header nav footer article section aside
datalist ：配合input应用，输出时会提醒关键词
<input type="text" placeholder="请输出明星" list="star"> <datalist id="star"> <option>杨超过</option> <option>刘德华</option> <option>那英</option> <option>姚贝娜</option> <option>钢铁侠</option> </datalist>fliedset 将表单内的相干元素分组，打包
<fieldset> <legend>用户登录</legend> 用户名：<input type="text" name="" id=""><br> 明码：<input type="password" name="" id=""> </fieldset>input type新增属性值：
| **类型 | 应用示例** | 含意** |
|---|---|---|
| <input type="email"> | 输出邮箱格局 | |
| tel | <input type="tel"> | 输出手机号码格局 |
| url | <input type="url"> | 输出url格局 |
| number | <input type="number"> | 输出数字格局 |
| search | <input type="search"> | 搜寻框（体现语义化） |
| range | <input type="range"> | 自在拖动滑块 |
| time | <input type="time"> | 小时分钟 |
| date | <input type="date"> | 年月日 |
| datetime | <input type="datetime"> | 工夫 |
| month | <input type="month"> | 月年 |
| week | <input type="week"> | 星期 年 |
罕用新属性
- placeholder：输出时候提醒文字隐没
- autofocus:让input表单加载页面时默认被选中
- multiple：多文件上传（默认的file是单个文件上传）
- required:必填项；内容不能为空
- accesskey:规定激活（使元素取得焦点）元素的快捷键，采纳alt+S的模式
多媒体标签
embed:标签定义嵌入的内容,能够用来插入Midi,wav,AIFF,AU,MP3等格局，url是音频或视频文件及其门路；
- audio:播放音频
- autoplay自动播放
- controls是否显示不播放控件
- loop循环播放（loop或loop="-1"有限循环）
多浏览器反对的计划
<audio src=""> <source src="..."> <source src="..."> 您的浏览器不反对HTML音频播放性能 </audio>video:播放视频
<video src="..." controls></video>
- autoplay自动播放
- controls是否显示控件
- loop循环播放
- width设置窗口宽度
- heigh设置窗口高度
多浏览器反对的计划和audio相似