HTML中常用知识点整理

html复习

HTML

是一个超文本标记语言
w3c标准：结构标准，表现标准，行为标准。

基本结构

<!doctype html>
<html><head><title>网页的标题</title><meta charset="utf-8"/></head><body></body>
</html>

基本标签

1.段落标签：

<p></p>

2.标题标签：

<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>

3.换行标签：

<br />

4.水平线：

<hr/>

5.字体样式标签：

<strong>加粗</strong>
<b>加粗</b>
<em>斜体</em>

6.特殊符号：

大于：&gt;小于：&lt;空格：&nbsp;引号：&quot;版权符号：&copy;

7.图像标签：

<img src="图片路径" alt="图片显示不出来时显示的内容" title="鼠标悬浮显示的内容" width="宽度" height="l高度"  />

相对路径：相对于当前页面的路径，eg: ../img.jpg img/img.jpg
绝对路径：相对于本机的路径，eg:D:\常用资料\21IT技能大赛\img.jpg
src:图片的地址（相对路径和绝对路径都可以）
alt：图片显示不出来时显示的替换文字内容，eg:alt="这是图书"
title：鼠标悬浮时显示的内容，eg:title="这是图书"
width:图片显示的宽度，eg:width="100"
height:图片显示的高度，eg:height="100"

8.超链接：

<a href="路径" target="是否在当前窗口中打开">百度一下</a>

href:跳转页面的地址，相对路径和绝对路径都可以
target：有两个值，_self:当前窗口打开超链接 _blank:在新窗口中打开超链接

9.锚链接：

从页面的甲处跳转到乙处

语法：

甲处：<a href="#yi">去乙处</a>
乙处：<p id = "yi"></p>

10.块级元素和行内元素：

块级元素：单独占一行，宽度是浏览器的宽度
行内元素：内容撑开宽度，内容多宽，元素就多宽。左右都是行内元素，自动排列在一行

列表、表格和媒体元素

1.无序列表：

<ul><li>No.1</li><li>No.2</li><li>No.3</li><li>No.4</li></ul>

2.有序列表：

<ol><li>No.1</li><li>No.2</li><li>No.3</li><li>No.4</li></ol>

3.定义列表：

<dl><dt>蔬菜</dt><dd>黄瓜</dd><dd>南瓜</dd><dd>冬瓜</dd><dd>北瓜</dd></dl>

4.表格：

<table border="1" cellspacing="0" style="text-align: center;"><tr><td colspan="3">第一列</td></tr><tr><td rowspan="2">第一列</td><td>第二列</td><td>最后一列</td></tr><tr><td>第二列</td><td>最后一列</td></tr></table>

运行结果：

第一列
第一列	第二列	最后一列
	第二列	最后一列

5.音频元素：

<audio src="音频文件" autoplay="autoplay" controls="controls"></audio>

6.视频元素：

<video src="视频文件" autoplay="autoplay" controls="controls"></video>

**src：**音频或者视频的路径
**autoplay：**自动播放
**controls：**显示播放控件

7.网页结构元素：

<header><nav>导航</nav></header><section>中间</section><footer>底部</footer>

表单元素

1.文本框：

<input type="text" name="name" value="mxx" size="20" maxlength="20" placeholder="请输入用户名" required="required" readonly="readonly" />

type：表单的类型
name：表单元素的名称
value：默认值，初始值
size：表单的初识宽度
maxlength：最大输入的字符数
placeholder：提示信息
required：是否必填，不写的话不用必填
readonly：是否只读

2.密码框：

<input type="password" name="pass"  />

3.单选按钮：

<input type="radio" name="sex" />男
<input type="radio" name="sex" />女

注意：name的值必须要一样，否则不能单选

4.复选框：

<input type="checkbox"  checked="checked name="hob" />打篮球
<input type="checkbox" name="hob" />堆雪人
<input type="checkbox" name="hob" />打雪仗

注意：checked是默认选中的意思，可适用于单选按钮和复选框

5.下拉列表：

<select><option>山东</option><option selected="selected">山西</option><option>河南</option><option>河北</option>
</select>

注意：selected是默认选中

6.按钮：

<button disabled="disabled">普通按钮</button>
<input type="button" value="普通按钮" />
<input type="reset" value="重置按钮" />
<input type="submit" value="提交按钮" />

注意：disabled：是禁用按钮

7.多行文本域：

<textarea cols="5" rows="20">欢迎关注微信公众号：雄雄的小课堂</textarea>

cols：列
rows：行

8.文件域：

<input type="file" name="files" />

9.邮箱：

<input type="email" name="files" />

10.数字框：

<input type="number" min="0" max="100" step="100"/>

min：最小值
max：最大值
step：步幅

11.滑块：

<input type="range" min="0" max="100" step="1"/>

12.日期表单：

<input type="date" name="borndate"/>

13.隐藏域：

<input type="hidden" name="id"/>

14.语义化标签：

<label>用户名</label>

15.正则表达式验证：

<input type="text" name="phone" pattern="^1[3456789]\d{9}" />

pattern：值是正则表达式

HTML中常用知识点整理相关推荐

敏捷ACP 常用关键词整理敏捷ACP 常用知识点整理
敏捷ACP 常用关键词整理敏捷ACP 常用知识点整理一.MoSCoW 1.MoSCoW : 读作"莫斯科",适用于故事优先级的排序,首次出现在 3-13敏捷产品实践:产品待 ...
POWER PCB(PADS LAYOUT)中常用快捷键整理大全
POWER PCB(PADS LAYOUT)中常用快捷键整理大全 488阅读凡亿教育关注一.原理图库 P/P:画元器件引脚 P/A:画弧线P/L:画直线 P/A:画矩形 T/C:创建一个新的元器件 ...
oracle 常用知识点整理
转 : oracle 常用知识点原文链接:http://blog.csdn.net/weijiaxiaobao/article/details/51323573 Oracle 是一个庞大的系统,里 ...
CTF常用知识点整理（个人刷题中整理）
由于是之前刷题的整理,参照了很多大神的博客,由于过于零碎,没能记录下各位大神的文章出处(以后会提高版权意识的),如有侵权,私聊补加出处或者删文章. 博主是入门半年的萌新,文章不可避免会有很多错误,还请 ...
工作中常用知识点、工具总结
java 开发环境 jdk java 集成开发环境 IDE 下载 mavem 依赖管理下载 Git 代码版本管理下载 XFtp.XSheel 上传文件到远端服务器.连接服务器命令行安装mysql ...
IDEA中常用快捷键整理及重置快捷键
记录了一下自己开发过程中的一些常用快捷键,方便以后查询 ctrl+shift+u 大小写切换快捷键 Alt+Enter 导入类 import class ,还可以用以实现未实现的接口方法能够自动修复 ...
Css中部分知识点整理【笔记整理】
CSS中塌陷现象: 两个盒模型中未设置行内属性或者浮动当上方元素指定了margin-bottom ,下方元素指定了margin-top时这两个margin就会发生合并,塌陷尺寸是两个值中较大的一个 ...
Observable常用知识点整理
文章目录 Observable 基础概述操作符创建操作 Create Defer Empty/Never/Throw From Interva just Range Repeat Start T ...
PostGIS中常用函数整理记录
文章目录 WKT中几何对象版本控制函数几何对象构造函数几何对象输出函数几何验证函数空间参考系统功能函数几何属性访问函数几何测量函数几何图形编辑函数几何处理函数仿射变换函数边界框函 ...