美文网首页
0919(选择器)

0919(选择器)

作者: happywho250 | 来源:发表于2016-09-19 23:23 被阅读0次

    0919内容:

    1. 认识html常用标签,css样式,css属性。
      将一个页面拆分成多个页面,iframe,

    扩充:
    断点续传 以及 百度云上传机制,断点续传是一种结合本地存储和网络存储的技术,主要用来解决网络失效时的视频丢失问题。网页内不支持断点续传,大文件不建议网页上传,
    md5:为计算机安全领域广泛使用的一种散列函数,用以提供消息的完整性保护使用客户端,每一个文件都有一个32位的检验码,md5,比如上传视频到百度云,客户端会首先分析文件,生成一个32位校验码与服务器上比对,如果与服务器码值相同,则会实现秒传功能,实际没有上传本地,只是把服务器已有的保存到你的个人文件夹(云端同样的文件不会保存两份)

    teleport pro软件 直接将网页内的所有内容down到本地访问

    隐藏域<form type="hidden" name="id" value="10">比如论坛评论,很多个帖子,评论都提交到服务器的一个地方进行处理,服务器就通过隐藏域来进行识别

    html中的iframe

                  将一个页面才分成多个部分,如做后台管理系统      
                  <a href="2.html" target="fir">用户管理</a>  
                  //单击使2.html页面在name名为"fir"的iframe分页上打开  
                   <a href="3.html" target="fir">书籍管理</a>  
                   //单击使3.html页面在name名为"fir"的iframe分页上打开   
                  <iframe src="0.html" frameborder="1" width="400px"height="400pxbackground-color="red"  
                  name="fir"></iframe>//一个默认页面为0.html的分页
    

    css选择器

    1. 通用选择器 *{样式}

    2. 标签选择器 E{样式}

    3. class选择器 .class名{样式}

    4. ID选择器 #ID名{样式}

    5. 多元素的组合选择器
      5.1 多元素选择器 E,F{样式} 匹配所有的E,F元素
      p,a{background:red;}p,a元素背景都为红色
      5.2 后代元素选择器 E F{样式} 匹配所有属于E元素的后代F元素
      p a{color:red;}p元素的后代a元素颜色为红色
      5.3 子元素选择器 E>F{样式} 匹配所有的E元素的子一代F元素(第一层后代)
      p>a{color:red;} a只能属于p的子一代,不能是其他
      5.4 毗邻元素选择器 E+F{样式} 匹配紧随E元素之后的一个同级F元素
      5.5 同级通用元素选择器 E~F{样式} 匹配E元素之后的所有同级F元素(中间允许有其他元素间隔)

    6. 伪类及伪对象选择器
      6.1 :link,设置未被访问前的状态
      6.2 :hover, 设置鼠标悬停是的状态
      6.3 :visited, 设置访问后的状态
      6.4 :active, 设置点击是的状态
      6.5 :after, 用来和 content 属性一起使用,设置在对象后(依据对象树的逻辑结构)发生的内容。

        body:after {  
        content: "The End"; body结束后页面会出现 The End的内容
        display: block;  
        margin-top: 2em;  
        text-align: center;
       }  
      

    6.6 :before, 用来和 content 属性一起使用,设置在对象前(依据对象树的逻辑结构)发生的内容。
    6.7 :first,设置页面容器第一页使用的样式。仅用于 @page 规则
    @page :first { margin: 4cm }
    6.8 :first-letter, 设置对象的第一个字符的样式
    6.9 :first-child, 设置E的第一个子对象元素
    p:first-child{background-color:red;}第一个P标签背景为red.
    6.10 :first-line,设置第一行的样式
    6.11 E:not(s) 匹配所以不匹配选择符s的元素E
    6.12 E:target对页面中的某个target元素指定样式,在用户单击了页面中的链接并且跳转到了target元素才会生效 匹配相关url指定的E元素
    <style>
    :target{background-color:red};
    </style>
    </head>
    <body>
    <a href="#one">one</a>
    <a href="#two">two</a>
    <a id="one">A部分</a>
    <a id="two">B部分</a>
    </body>
    当单击one时A部分显示红色,当单击two时B部分显红色

    1. 结构性伪类选择器
      7.1 E:root 匹配文档的根元素。在HTML中,根元素永远是HTML
      7.2 E:empty 匹配没有任何子元素(包括text节点)的元素E
      7.3 E:last-child 匹配父元素中最后一个E元素
      7.4 E:nth-child(n) 匹配父元素中的第n个子元素E
      7.5 E:nth-last-child(n) 匹配父元素中的倒数第n个结构子元素E
      7.6 E:first-of-type 匹配同级兄弟元素中的第一个E元素
      7.7 E:only-child 匹配属于父元素中唯一子元素的E
      7.8 E:only-of-type 匹配父元素下使用同种标签的唯一一个子元素(同种元素只存在一个)
      7.9 E:nth-of-type(n) 匹配同类型中第n个同级兄弟元素E
      7.10 E:nth-last-of-type(n) 匹配同类型中的倒数第n个同级兄弟元素E
    2. UI元素状态伪类
      8.1 E:enable 匹配所有用户界面(form表单)中处于可用状态的元素E
      8.2 E:disable 匹配所有用户界面(form表单)中处于不可用状态的E元素
      8.3 E:checked 匹配所有用户界面(form表单)中处于选中状态的元素E
      8.4 E::selection 匹配E元素中被用户选中或处于高亮状态的部分
    3. 子串匹配的属性选择器
      9.1 E[att^="val"] 匹配具有att属性、且值以val开头的E元素
      9.2 E[attr$="val"]匹配具有att属性、且值以val结尾的E元素
      9.3 E[attr*="val"]匹配具有att属性、且值中含有val的E元素
      9.4 E[attr]匹配具有attr属性的所有E元素

    相关文章

      网友评论

          本文标题:0919(选择器)

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