特殊符号
<!--注释--> 注释
<em></em>斜体 <strong></strong>加粗 <hr/>分割线 <br/> 换行
空格 >大于号> <小于号< "引号(“”) ©版权符号
<span></span>加粗
文本元素
font-size:16px; 文字大小
Font-weight: 700 ; 值从100-900，文字粗细，不推荐使用font-weight:bold;
Font-family:微软雅黑; 文本的字体
Font-style: normal | italic; normal 默认值 italic 斜体
line-height: 行高
文本属性连写 font: font-style font-weight font-size/line-height font-family;
注意：font:后边写属性的值。一定按照书写顺序。
文本属性连写文字大小和字体为必写项。
Font:italic 700 16px/40px 微软雅黑;
图片链接 ../表示上一级文件夹
<img src ="img/mei.jpg"alt="加载失败" height="200" width="300">
Src 图片地址
Alt代表如果加载不了图片就执行alt的文字 height高度 width 宽度
超链接
<a href="html/demo02.html" target="_self">文字</a>
_blank 新建一个页面打开链接
_self 在本页面打开链接
锚链接
<a href="#cha01" >跳到第一章</a>
<a name="cha01" >山雨欲来</a>
功能性链接 电子邮件、QQ、MSN等链接
[<a href="mailto:xiahao@126.com">联系夏昊</a>]
地址钱要放mailto:
链接入视频
<video width="300px" height="300px" controls autoplay 自动播放>
<source src="video/video.webm" type="video/webm">
<source src="video/video.mp4" type="video/mp4">
您的浏览器不支持播放视频
</video>
Controls 表示显示控制面板
链接入音频
<audio controls>
<source src="music/music.mp3" type="audio/mpeg">
<source src="music/music.ogg" type="audio/ogg">
您的浏览器不支持音频
</audio>
表格
<tr>代表行 <td>代表列
在表格中colspan="3"代表跨列 rowspan="2"代表跨行
列
<table>
<tr>
<td colspan="3">成绩表</td>
</tr>
<tr>
<td rowspan="2">张三</td>
</tr>
</table>
无序列表
以<li>标签标示列表项 无序列表中的每项都是平级的，没有级别之分，并且列表中的内
容一般都是相对简单的标题性质的网页内容
<ul>
<li></li>
</ul>
有序列表
以<li>标签标示列表项 有序列表ol-li一般用于带有顺序编号的特定场合
<ol>
<li></li>
</ol>
定义类表
以<dt>标签定义列表项 以<dd>标签定义内容 定义列表一般用于带有标题和标题解释性内容的场合
<dl>
<dt> 标题</dt>
<dd>列表项</dd>
</dl>
列表的样式
|
值 |
说明 |
语法试列 |
|
none |
无标记符号 |
List-style:none; List-style-image; | position |
|
disc |
空心圆，默认类型 |
List-style-type:disc; |
|
circle |
空心圆 |
List-style-type:circle; |
|
square |
实心正方形 |
List-style-type:square; |
|
decimal |
数字 |
List-style-type:decimal; |
HTML5的结构元素：
|
元素名 |
描 述 |
|
header |
标题头部区域的内容（用于页面或页面中的一块区域） |
|
footer |
标记脚部区域的内容（用于整个页面或页面的一块区域） |
|
section |
Web页面中的一块独立区域 |
|
article |
独立的文章内容 |
|
aside |
相关内容或应用（常用于侧边栏） |
|
nav |
导航类辅助内容 |
列：<header><h2>网页头部</h2> </header>
<section><h2>网页主体部分</h2></section>
<footer><h2>网页底部</h2></footer>
表单
表单的基本结构:
<form method="post" action="result.html">
<p> 名字：<input name="name" type="text" > </p>
<p> 密码：<input name="pass" type="password" > </p>
<p>
<input type="submit" name="Button" value="提交">
<input type="reset" name="Reset" value="重填">
</p>
</form>
Method: 发送表单数据的方式常用值：get | post
post方式提交的数据安全性要明显高于get方式提交的数据。因此在实际开发中通常采用
post方式提交表单数据。
Action: 向何处发送表单数据
表单的元素:
|
属性 |
说明 |
|
type |
元素类型：text文字：password密码：checkbox 复选框、radio单选选框、submit提交按钮、reset重置按钮、file选择按钮、image图片按钮，button普通按钮，hidden 隐藏域，默认为 text Email 邮箱文本框 number 数字 number数字文本框search 搜索框 hidden 隐藏域 readonly 只读文本框 disabled 禁用 |
|
size |
元素的宽度，当 type 为 text 或 password时 |
|
maxlength |
type为text 或 password 时，输入的最大字符数 |
|
checked |
type为radio或checkbox时，指定按钮是否是被选中 |
|
name |
指定表单的名称 |
|
value |
元素的初始值 type为radio时必须指定一个值 |
在form表中用提交元素是要在form后面注入地址和提交方式
<form action="../demo03.html" method="post" </form>
选择框
列：
<p>性别<input type="radio" name="sex">男<input type="radio" name="sex">女 </p>
下拉列表框:
<select name="名称" size="行数">
<option value="值" selected="selected">
…
</option >
<option value="值">…</option>
</select>
selected="selected"设置默认值”
列
<p>城市(下拉列表)：
<select name="city">
<option value="1">北京</option>
<option value="2" selected="selected">上海</option>
<option value="南京">南京</option>
<option value="河北">河北</option>
</select>
</p>
多行文本域:
<textarea name=”showText” cols=”x” rows=”y”>文本内容</txtarea>
textarea 多行文本域
Cols 显示的列数
Rows显示的行数
多行文本框
<p>个人简介(多行文本框)：<textarea cols="30" rows="10" name="area">个人喜欢玩电脑，性格开朗，活泼好动~~~~~~</textarea></p>
Cols列数
Rows 行数
数字文本框
<input type=”number” name=”mum” min=”0” max=”100” step=”10”/>
Min允许的最小值
Max允许的最大值
Step合法的数字间隔
搜索框
<input type=”search” name=”sousuo”/>
<input type=”submit” value=”Go”/>
隐藏域
<input type=”hidden” value=”66” name=”userid”>
只读文本框
<input name=”name” type=”text” value=”张三” readonly>
禁用
<input type=”submit” value=”修改” disabled | disabled=”disabled”>
表单元素的标注
增强鼠标的可用性 自动将焦点转移到与该焦点标注相关的表单元素上
<label for=”id”>标注的文本</label>
<input type=”radio” name=”gender” id=”male”>
列
<label for=”pass1”>密码</label><input name=”pass” type=”password” id=”pass1”>