1.标签 a.文本标签:p,span,a,b,i,u,em.文本标签里只能放文字,图片,表单元素. 上标,下标: 5<sup>2</sup>(上标) 8<sub>2</sub>(下标) b.容器级标签:div,h系列,li,dt,dd,容器级标签里可以放任何东西. 1.块级标签div和span: div的语义division"分割";span的语义"范围,跨度",都是重要的盒子.两者的区别是,div块会换行,span不换行的(span内不可放标签). 2. 标签a (超链接,以a标签为例) 1.超链接:<a href="new.html">点击进入新网页</a> 2.锚链接:<a name="top">顶部,设定锚链接</a> <a href="#top">回到顶部,返回到设定锚链接</a> 3.邮件链接:<a href="mailto:leew2017@126.com">找m</a> 4.特殊链接:<a href="#">跳转到顶部</a> 与js相关: <a href="javascript:alert(1)">内容</a>执行 <a href="javascript:;">内容</a>代表不执行 5.超链接的属性: 1.href:目标URL 2.title:悬停文本 3.name:主要用于设置一个锚点的名称. 4.target:打开浏览器的方式: _self:在同一个网页显示(默认) _blank:在新的窗口中打开 _parent:在父窗口显示 _top:在顶级窗口中显示 c.图片标签<img/>(属于单边标记) img:代表一张图片,img是自封闭标签,也称为单标签. src属性:指图片的路径(相对路径,绝对路径都可以) 例: <img src="2.jpg"> <img src=".2.jpg">(linux形式) <img src="images/1.jpg"> <img src="file://C:UsersDanny明星1.jpg" alt="" /> <img src="http://www.baidu.com/2016040102.jpg"> img其他属性: 宽度(宽高做好只设置一个) height:高度 title:提示性文本.公有属性(鼠标悬停时出现的文本) align:指图片的水平对齐方式, 属性值可以是:left,center,right(左中右) alt:当照片显示不出来时,代替图片显示的内容. d. h1~h6标签 : 定义标题的大小(h1最大,h6最小), 具有align排版属性,属性值可以是:left,right,center (分别代表 靠左,靠右,居中) e.列表标签ul,ol,dl 1.无序列表<ul>,无序列表中每一项都是<li> ul:unordered list(无序列表) li:list item(列表项,必须跟随ul或ol) ul属性值:<ul type="属性值"></ul> disc(实心原点,默认) square(实心方点) circle(空心圆) 2.有序列表<ol>,里面的每一项是<li> ol:ordered list(有序列表) ol属性值:<ol type="属性值"></ol> 1(阿拉伯数字,默认) a(有序小写字母) A(有序大写字母) i(另一种数字方式) I(同i大写) 3.定义列表<dl> (dl与dd都只能属于对方,定义列表的作用很大) dl:definition list,没有属性,dl的子元素只能是dt和dd. dt:definition title,列表的标题,这标题是必须的 dd:definition description 列表项,如果不需要,可不加 2.表格标签<table> (表格是由行组成的(行是由列组成的),而非行和列。) 表格<table>是由每行<tr>组成的,每行是由<td>组成的. a.table的属性: border:边框,像素为单位 style="border-collapse:college;" 单元格的线和表格的边框线合并 宽度 height:高度 bordercolor:表格边框颜色 align:表格的水平对齐方式,属性值:left center right cellpadding:单元格内容到边距离,像素单位,默认为0 cellspacing:单元格和单元格之间的距离(外边框),默认0 bgcolor="#99cc66":表格的背景颜色 background="路径src/...":背景照片 背景照片的优先级大于背景颜色 b.行<tr> (表格是由一行一行组成的) 属性: dir:此行行内内容排列方式(公有属性) ltr:从左到右(left to right,默认) rtl:从右到左(right to left) bgcolor:设置这一行的背景颜色(注:行内无法设置背景照片) height:1行的高度 align="center":行内内容的水平居中显示(left,center,right) valign="middle":行内内容垂直居中显示(top,middle,bottom) c.单元格<td> 属性: align:内容水平对齐方式.(left,center,right) valign:内容垂直对齐方式(top,middle,bottom) 单元格的高度 bgcolor:设置单元格的背景颜色 background:设置这个单元格的背景图片 d.单元格的合并 将两个单元格合并,就需要删除一个单元格 单元格属性: colspan:横向合并.例colspan="2" 表示当前单元格水平方向上要占据两个位置. rowspan:纵向合并.例rowspan="2" 表示当前单元格垂直方向上要占据两个位置. e.其他属性 <th>:加粗的单元格,相当于<td>+<d> 属性同<td>标签 <caption>:表格的标题,使用时和tr标签并用. f.表格的标签<thead>,<tbody>,<tfoot> 写了控制读取顺序 3.表单标签用<form>表示,用于与服务器的交互.表单就是收集用户信息的,就是让用户填写的,选择的. 属性: name:表单的名称,用于JS来操作和控制表单时使用. id:表单的名称,用于来操作或控制表单时使用. action:指定表单数据的处理程序, 一般是php,如:action="login.php" method:表单数据的提交方式,一般取值:get(默认),post 4.<input>输入标签(文本框) :用于接收用户输入. 例:<input type="text" /> 属性:type="属性值"属性值可以是: text(默认):文本类型 password:密码类型 radio:选单按钮,名字相同的按钮作为一组进行单选 (单选按钮,天生只能选一个,想多选必须名字一样) checkbox:多选按钮,名字相同的按钮作为一组进行选择. checked:将单选按钮或多选按钮默认处于选中状态. 当<input>标签的type="radio"时,可以用这个属性.可省略. hidden:隐藏框,在表单中包含不希望用户看见的信息 buttom:普通按钮,结合js代码进行使用 submit:提交按钮,传送当前表单的数据给服务器或其他程序处理. 这个按钮不需要写value,自动就会有"提交"文字,这个按钮有提交功能. 点击后,表单就会被提交到form标签的action属性指定的页面中去. reset:重置按钮,清空当前表单的内容,并设置为最初的默认值. image:图片按钮,和提交按钮的功能完全一致,只不过图片按钮可以显示图片. file:文件选择框 value="内容":文本框里的默认内容 size="50":表示文本框内可以显示五十个字符,一个英文或中文都算一个字符. readondy:文本框只读,不能编辑,因为它的属性值也是readonly,所以属性值可不写. 这个属性Google光标点不进去,IE可点进去,但不可以编辑 disabled:文本框只读,不能编辑,光标点不进去,属性值可以不写. 5.<select>:下拉列表标签 <select>标签里面每一项用<option>表示.select就是"选择",option就是"选项". select标签和ul,ol,dl一样,都是组标签. <select>标签的属性: multiple:可以对下拉列表中的选项进行多选,没有属性值 size="3":如果属性值大于1,则列表为滚动视图,默认属性值为1,即下拉视图. <option>标签的属性: selected:预选中.没有属性值. <textarea>标签:多行文本输入框 属性: value:提交给服务器的值 rows="4":指定文本区域的行数 cols="20":指定文本区域的列数 readonly:只读 6.表单语义化 比如,我们在注册一个网站信息时,部分必填,另部分选填,这时可以利用表单的语义化。 7.<label>标签 <input type="radio" name="sex" /> 男 <input type="radio" name="sex" /> 女 上述,必须选单选框才可以选中,文字和input标签没有关系 <input type="radio" name="sex" id="nan" /> <label for="nan">男</label> <input type="radio" name="sex" id="nv" /> <label for="nv">女</label> input元素有一个id,然后label标签有for属性,和id相同,这个label和input就有绑定关系了。当然了,复选框也有label:(任何表单元素都有label) 8.颜色 red,green,blue,orange,gray等 rgb(255,0,0) #FF0000 , #0000FF , #00FF00 等 9.特殊字符: :空格(non-breaking spacing,不断打空格) < :小于号(less than) > :大于号(greater than) & :符号& " :双引号 ' :单引号 © :版权标志 ™:商标标志
html干货部分:1.标签a.文本标签:p,span,a,b,i,u,em.文本标签里只能放文字,图片,表单元素.上标,下标: 5<sup>2</sup>(上标) 8<sub>2</sub>(下标)b.容器级标签:div,h系列,li,dt,dd,容器级标签里可以放任何东西.1.块级标签div和span:div的语义division"分割";span的语义"范围,跨度",都是重要的盒子.两者的区别是,div块会换行,span不换行的(span内不可放标签).2. 标签a (超链接,以a标签为例)1.超链接:<a href="new.html">点击进入新网页</a> 2.锚链接:<a name="top">顶部,设定锚链接</a> <a href="#top">回到顶部,返回到设定锚链接</a>3.邮件链接:<a href="mailto:leew2017@126.com">找m</a>4.特殊链接:<a href="#">跳转到顶部</a>与js相关:<a href="javascript:alert(1)">内容</a>执行<a href="javascript:;">内容</a>代表不执行5.超链接的属性:1.href:目标URL2.title:悬停文本3.name:主要用于设置一个锚点的名称.4.target:打开浏览器的方式:_self:在同一个网页显示(默认)_blank:在新的窗口中打开_parent:在父窗口显示_top:在顶级窗口中显示
c.图片标签<img/>(属于单边标记)img:代表一张图片,img是自封闭标签,也称为单标签.src属性:指图片的路径(相对路径,绝对路径都可以)例:<img src="2.jpg"><img src=".2.jpg">(linux形式)<img src="images/1.jpg"><img src="file://C:UsersDanny明星1.jpg" alt="" /><img src="http://www.baidu.com/2016040102.jpg">img其他属性:宽度(宽高做好只设置一个)height:高度title:提示性文本.公有属性(鼠标悬停时出现的文本)align:指图片的水平对齐方式,属性值可以是:left,center,right(左中右)alt:当照片显示不出来时,代替图片显示的内容.
d. h1~h6标签 : 定义标题的大小(h1最大,h6最小),具有align排版属性,属性值可以是:left,right,center(分别代表 靠左,靠右,居中)e.列表标签ul,ol,dl1.无序列表<ul>,无序列表中每一项都是<li>ul:unordered list(无序列表)li:list item(列表项,必须跟随ul或ol)ul属性值:<ul type="属性值"></ul>disc(实心原点,默认)square(实心方点)circle(空心圆)2.有序列表<ol>,里面的每一项是<li>ol:ordered list(有序列表)ol属性值:<ol type="属性值"></ol>1(阿拉伯数字,默认)a(有序小写字母)A(有序大写字母)i(另一种数字方式) I(同i大写)3.定义列表<dl>(dl与dd都只能属于对方,定义列表的作用很大)dl:definition list,没有属性,dl的子元素只能是dt和dd.dt:definition title,列表的标题,这标题是必须的dd:definition description 列表项,如果不需要,可不加 2.表格标签<table> (表格是由行组成的(行是由列组成的),而非行和列。)表格<table>是由每行<tr>组成的,每行是由<td>组成的.
a.table的属性:border:边框,像素为单位style="border-collapse:college;"单元格的线和表格的边框线合并宽度height:高度bordercolor:表格边框颜色align:表格的水平对齐方式,属性值:left center rightcellpadding:单元格内容到边距离,像素单位,默认为0cellspacing:单元格和单元格之间的距离(外边框),默认0bgcolor="#99cc66":表格的背景颜色background="路径src/...":背景照片背景照片的优先级大于背景颜色b.行<tr> (表格是由一行一行组成的) 属性: dir:此行行内内容排列方式(公有属性) ltr:从左到右(left to right,默认) rtl:从右到左(right to left) bgcolor:设置这一行的背景颜色(注:行内无法设置背景照片) height:1行的高度 align="center":行内内容的水平居中显示(left,center,right) valign="middle":行内内容垂直居中显示(top,middle,bottom)c.单元格<td> 属性: align:内容水平对齐方式.(left,center,right) valign:内容垂直对齐方式(top,middle,bottom) 单元格的高度 bgcolor:设置单元格的背景颜色 background:设置这个单元格的背景图片d.单元格的合并 将两个单元格合并,就需要删除一个单元格 单元格属性: colspan:横向合并.例colspan="2" 表示当前单元格水平方向上要占据两个位置. rowspan:纵向合并.例rowspan="2" 表示当前单元格垂直方向上要占据两个位置. e.其他属性 <th>:加粗的单元格,相当于<td>+<d> 属性同<td>标签 <caption>:表格的标题,使用时和tr标签并用.
f.表格的标签<thead>,<tbody>,<tfoot> 写了控制读取顺序
3.表单标签用<form>表示,用于与服务器的交互.表单就是收集用户信息的,就是让用户填写的,选择的. 属性: name:表单的名称,用于JS来操作和控制表单时使用. id:表单的名称,用于来操作或控制表单时使用. action:指定表单数据的处理程序, 一般是php,如:action="login.php" method:表单数据的提交方式,一般取值:get(默认),post4.<input>输入标签(文本框) :用于接收用户输入.例:<input type="text" />属性:type="属性值"属性值可以是:text(默认):文本类型password:密码类型radio:选单按钮,名字相同的按钮作为一组进行单选 (单选按钮,天生只能选一个,想多选必须名字一样)checkbox:多选按钮,名字相同的按钮作为一组进行选择.checked:将单选按钮或多选按钮默认处于选中状态.当<input>标签的type="radio"时,可以用这个属性.可省略.hidden:隐藏框,在表单中包含不希望用户看见的信息buttom:普通按钮,结合js代码进行使用submit:提交按钮,传送当前表单的数据给服务器或其他程序处理.这个按钮不需要写value,自动就会有"提交"文字,这个按钮有提交功能.点击后,表单就会被提交到form标签的action属性指定的页面中去.reset:重置按钮,清空当前表单的内容,并设置为最初的默认值.image:图片按钮,和提交按钮的功能完全一致,只不过图片按钮可以显示图片.file:文件选择框value="内容":文本框里的默认内容size="50":表示文本框内可以显示五十个字符,一个英文或中文都算一个字符.readondy:文本框只读,不能编辑,因为它的属性值也是readonly,所以属性值可不写.这个属性Google光标点不进去,IE可点进去,但不可以编辑disabled:文本框只读,不能编辑,光标点不进去,属性值可以不写.5.<select>:下拉列表标签<select>标签里面每一项用<option>表示.select就是"选择",option就是"选项".select标签和ul,ol,dl一样,都是组标签.<select>标签的属性:multiple:可以对下拉列表中的选项进行多选,没有属性值size="3":如果属性值大于1,则列表为滚动视图,默认属性值为1,即下拉视图.<option>标签的属性:selected:预选中.没有属性值.<textarea>标签:多行文本输入框属性:value:提交给服务器的值rows="4":指定文本区域的行数cols="20":指定文本区域的列数readonly:只读6.表单语义化比如,我们在注册一个网站信息时,部分必填,另部分选填,这时可以利用表单的语义化。7.<label>标签<input type="radio" name="sex" /> 男<input type="radio" name="sex" /> 女上述,必须选单选框才可以选中,文字和input标签没有关系<input type="radio" name="sex" id="nan" /> <label for="nan">男</label><input type="radio" name="sex" id="nv" /> <label for="nv">女</label>input元素有一个id,然后label标签有for属性,和id相同,这个label和input就有绑定关系了。当然了,复选框也有label:(任何表单元素都有label)
8.颜色 red,green,blue,orange,gray等 rgb(255,0,0) #FF0000 , #0000FF , #00FF00 等
9.特殊字符: :空格(non-breaking spacing,不断打空格)< :小于号(less than)> :大于号(greater than)& :符号&" :双引号' :单引号© :版权标志™:商标标志