整理
常用标签
a
超链接<a> </a>
1,做超链接,超链接文字内容,指向明确 href属性里面写上指向的地方
2,做下载 ,href属性属性指向文件(不能下载的txt,网页文件,图片,)
3,做锚点,两个标签一个是name属性给个名字做锚点 第二个需要返回的地方href指向name给的名字(名字前面加#)eg: <a name=”top”> 锚点</a>
<a herf=”#top>回到顶点</a>
Img /
单标签 前面学了俩了(meta 和br)
src 来源选择路径(浏览器访问两次,第一次找的这个文件,第二次是通过链接找图片)
widtk 属性宽度
height 属性高度 单位像素
alt 文字提示是什么图做提示用
title 鼠标放上显示的名字的效果
图片超链接
文字换成img图片就行了
表格标签
table代表表格
属性 bordercolor 表格颜色
tr代表行
td代表单元格只有单元格里面有属性 属性:height属性单元格的高度
width属性单元格的宽度
align属性水平对齐方式:
left左对齐
right右对齐
center 居中对齐
valign属性垂直对齐方式:
top 靠上
bottom靠下
middle 中间
bgcolor 背景色
rowspan 属性是合并单元格(行)
colspan 属性是合并单元格(列)
th用来做表头的也就是表的第一行(自动居中,一般没用的)。
Wifth宽度属性:1固定像素。2百分比。
Border边框属性:粗细,多少像素
Cellspacing 单元格的边距,边距 就是单元格距离上面的距离,单位像素
Cellpadding单元格的间距,间距就是单元格内部距离
表单元素:
标签<form></form>
属性:1.action 将用户输出的数据输到哪个页
2.method 的两种提交方式
(1)get提交 传值的时候在用户地址栏中可以看到是显示提交,有长度限制,
(2)post提交, 不可以在地址栏中看到
3. target
-b 新的
-p 前一个
-Solf 自身的
文本输入
1.<input /> 文本框 单标签
1. type=“text” 是文本框
Vslue规定文本框的值(默认文本框里输入的东西)
Name代表文本框的名称
2.Type=“password” 是密码框输入时候变成星号
Vslue规定文本框的值(默认文本框里输入的东西)
Name代表文本框的名称
3. type=“hidden 隐藏域
Vslue规定文本框的值 (默认文本框里输入的东西)
Name代表文本框的名称
4.文本域”
<Texterea></tectarea> 双标签 内容可以写中间值不是写在vslue属性里面的是写在开始结束标记之间的
按钮
Input
1、Type=”button 一个按钮”
属性valus 按钮上显示的文字
Name 按钮的名称
2、 type=“submit” 提交属性提交功能
属性valus 按钮上显示的文字
Name 按钮的名称
3. type=“reset”重置 将表单里面内容重置
属性valus 按钮上显示的文字
Name 按钮的名称
4. type=”image” 图片按钮 起提交作用,
Name 按钮的名称
Src 图片来源
选择输入类
1.Input Type=”radio” 属性单选按钮,一组中只能有一个被选中 通过name值做成一组才有互斥效果
Name 按钮名称和组名
Valus 按钮的值
2.Input type=”checkbox” 多选,复选
Name 复选框名称
Valus 按钮的值
3.下拉列表 <selece></select> 双标签 属性只有name
<option></option> 下拉列表里面的项 属性有 valus
. <select>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</select>
4.文件选择。Type=“file”
Name 文件选择的名称
其他属性 readonly 只读 可提交
Disabled 不可用 不可提交
Hidden 隐藏 可提交
Checked 用于radio checkbox 用来做默认选中的
Selecte 用于下拉列表 哪一项为选中的
框架
1 . <iframe></ iframe> 可以嵌在普通页面里面
属性
Src 框架里面要显示的页面地址
Width 框架的宽度
Heigh 框架的高度
Frameborder 框架的边框
Scrolling 有没有滚动条
2. <Frameset></<frameses> 框架集 如果使用框架集当年页面不能有不body 必须删除body
属性
Cols =“300,*” 这个是左右拆分,左边宽300右边宽剩余
Rows=“300,*” 这个是上下拆分 上面宽300 下面宽剩余
Frame 1 src 框架要显示的地址
Scrolling 滚动条
3. marquee 作滚动效果
属性
Direction 滚动方向
4. Mark 做标记的标签
属性
5. Hr 分割线 单标签
6. 页面嵌入视频
找到视频
视频左下方点击分享
复制html代码 复制flsh代码 复制通用代码
将复制的代码粘贴在页面里面
样式表
作用 美化页面
1.内联 写在标签里面 style=“样式” 对标签的控制精确 ,代码重用性差
2. 内嵌 写在文页面里面嵌在head里面 <style type=”text/css” >/*样式*/</style>
代码重用性强,对标签控制不是很精确
3.外部 单独的样式文件
引入方式 :右键-css样式表-附加样式表 控制没有内联精准,代码重用性最好
基础选择器 样式表用来选取元素的
1.标签选择器 比如 div{}
2.Class选择器 在样式里面把class换成a比如 class=“a” 就是.a{}
3.Id选择器 给元素设置唯一id ,通过这个id来控制 id用#换 , 比如id=“的“就是#d每个元素只有一个id 优先级最高
4.复合选择器
div,span{} 并列关系 逗号
#listli li 后代关系 找下面的关系,子元素 空格
Div.s 点筛选
样式 每个样式后面带分号
1 . 大小 Width 宽度 带单位px像素 whdth后面冒号
Height 高度
2 . 背景
Style=
background-color 背景色
Backgroung-image 背景图片
-repeat 图片的平铺方式 repeat 平铺
-position 背景图的位置 center 中间
空格加像素 空格做右下 左上
-attachment 是不是随页面滚动而变化 fised 固定的 不随滚轮动
Scroll 随着动
-size 背景图片的大小 写两个像素 前面是宽 后面是高
3 . 字体
Style=
Font-family 字体样式
-size 字体大小 单位像素 网页里小字体12像素 正文正常阅读的是14px 还有16 px
-style i是倾斜
-weight 加粗 可以选择值 一般选择b
Text-decoratio underline 下划线
Overline 上划线
None 去超链接的下划线
Line-zhrongh 删除线
Color 直接选颜色
4 . 对齐方式
水平对齐方式
Text-align center 字体水平居中
垂直对齐方式
Vertical –align middle 字体垂直居中 需要将默认行高字体行高设置的和div的一样高 需要配合行高使用
Line-height 行高
Text-indent 首行缩进多少像素
5. 边界 边框
Margin 外边距 顺时针 上右下左的顺序 空格设置像素px 看原来出线的位置,只与最近两方向有关 一般是上和左
Padding 内边距 也是上右下左 会相应的变大 所以
使用padding时候应减去加上的像素、只作用于本身
Boder 边框 简写方式boder:1px solid 颜色 可以选上下左右(边框粗细,边框样式,颜色)
列表,流
列表方块
列表style=
List-style none 去掉列表中的数值
Inside 控制序号在里面
Outside 控制学号在外面
List-style-image 将前面的序号换成图片
格式与布局 页面布局时候在最上面格式里面加*{magin:0px auto;padding 0px}
auto 居中
位置 关于元素所在位置
Position fixed 相对于浏览器边框位置固定
用四个方向直接调位置 top right bottom left 距离各个方向的像素
Absolute 和fixed区别是可以动 相对于父级元素,(浏览器,或者是绝对地位的上级)
Relative 相对自身应该出现的位置四个方向移动
流
Float left 向左流
Right 向右流
打破div 默认占一行 依次排列 用了流 元素自动浮上一层 magin 一般配合流用
<div style=“ clesr:both”></div> 清掉流! 每个流结束后清除
:hover 当鼠标放上来
鼠标变成手cursor pointer
Z-index 分层 必须搭配 float或者position relative使用 数越大越靠上