整理

常用标签

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使用 数越大越靠上

 

posted @ 2016-10-31 23:21  彬彬有礼☆  阅读(272)  评论(0编辑  收藏  举报