前端

作者: 宋song一 | 来源:发表于2018-08-28 15:44 被阅读0次

    一. jquery

    validation 表单form校验插件

    二. html

     DOM:文档对象模型
    

    1.frame

    frame标签与body标签不能共存
    被frame标签引用的页面可以不要页面结构,只保留body内部分

    2.form

    属性:
    1. action: 把当前表单的数据提交到哪里
    2. method: 请求方式.get请求,get请求在传递参数的时候,直接拼接在原来的URL地址之后,?key=value&.默认的请求方式.1KB,大小取决于浏览器/os/后台程序,最小的生效
    post请求,参数封装在请求体中.相对安全.传输文件时,必须使用post请求.hou
    内部常用的标签:input(输入框选择框),select(下拉框),textarea(大的输入框)

    2.1 input标签

    name 属性
    1.单选框/复选框分组.
    2.如果表单域中的数据要提交给后台服务器,就一定要设置该属性
    placeholder:提示文字,用于输入框和文本域
    checked : 默认选中
    value:
    1.设置按钮的文本
    2.设置输入框中的值
    3.设置单选/复选/下拉框中传递给后台的值
    type:
    1. text 默认,文本
    2. file 文件选择框
    3. radio 单选框
    4. checkbox 复选框
    5. password 密码(不可见,*表示)
    6. reset 重置按钮,value值为显示的文字
    7. submit 提交按钮
    8. button 自定义按钮,事件需要自己指定
    9. image 等同于submit,可以设置图片
    10. hidden 隐藏域

    2.2 select

           option选项,显示的下拉项元素
           selected  默认选中元素
          可设置optgroup项用于分组,其label属性为分组名
    

    3. a标签

           href属性: 跳转地址
                          相对路径,站内
                          绝对路径,站外
                          #id, 指向页面中的指定id
           target: 何处打开页面
                       _blank,新窗口打开
                      _self,当前框架打开,默认
    

    4. 字体

      <em>标签,显示为斜体.和<i>标签显示效果一样
     <strong>与<b>标签显示效果一致,html5建议b标签作为最后的选项
     <u>标签,显示为下划线,一般用于超链接
         <hr />水平分割线,自闭合标签.
    

    三.css

     用于定义样式
    

    3.1 使用方法:

           1. 行内使用 style属性
           2.内部样式表 head标签中使用style标签,使用选择器
           3.外部样式表 link调用.外部样式表内只保留style内部代码
           4.导入式样式表. 一般不用,网速慢时样式可能随后显示.head标签中使用style标签,@import url("*.css")
    

    3.2 选择器

           1.群组选择器
              样式相同的部分,可以将共同部分抽取出来,选择器直接用 , 分开
           2.后代选择器
              包含孙子节点. 选择器之间用空格隔开
           3.标签选择器
           4.子元素选择器, > 分割.不包含孙子节点
           5.属性选择器 
              多数情况下操作的是input节点
              [属性名]{
               }
             或
               [属性名=属性值]{
               }
    

    3.3 样式

           1. background背景样式
                     background可以直接定义5个属性.简写模式
                     background-attachment定义背景图位置是否固定/滚动
           2.文本样式
              text-indent 首行缩进2个字符,可设置为2em
          3.列表样式
             list-style-image:      将图象设置为列表项标志
             list-style-type:         设置列表项标记的类型
          4.轮廓样式
              outline
    

    3.4 盒子模型 Box Model

             box-sizing: border-box; 可设置盒子模型为指定宽高
             magin可设置为负值,可实现部分可见
             magin: 0  auto; 可实现水平对齐,上下为0,左右自动.
    

    3.5 元素

             1. 行内元素,行宽足够时在一行显示,不够时再换行. span,a,em
                使用 display:block; 可转换为块级元素,可设置宽高
             2.块级元素,独占一行
               display: inline; 可转换为行内元素
          display实现 行内元素 和 块级元素 的转换
               display: inline-block;把块级元素以行内元素的形式展现,同时保留块级元素可以设置宽高的特性
               display:none;隐藏元素
    

    3.6 定位

         position:relative;相对定位
        position: absolute;参考系是整个页面
        position: fixed;页面始终可见.参考系是浏览器窗口
    

    3.7 其它属性

                     1.清除浮动效果
          <div class="cls"> 
          </div>
    

    同时在style内

                 .cls{
                 clear: both;
                 }
          2.
           z-index,值越高,显示层级越高,可以保证在页面上面可见
    
    

    相关文章

      网友评论

          本文标题:前端

          本文链接:https://www.haomeiwen.com/subject/unfxwftx.html