• css基础知识


    css和html相结合的第一种方式:
    1,每一个html标签中都有一个style样式属性,该属性就是css代码
        例:<div style="color:#F00">这是一个div区域</div>
    2,使用style样式属性,该属性的值就是css代码。一般定义在head标签中,首先加载
        例:<style type="text/css">
        div{
        
        color:#F23;
        }
        </style>
    3,将上面style标记里的内容写在文件div.css中,再导入。div.css放在同一个文件夹中
        <strle type="text/css">
        @import url(div.css);
        </style>
    4.直接导入css样式
        <link rel="stylesheet" href="div.css" />(rel表示与页面的关系)
    css代码格式:
        选择器名称{属性名:属性值;属性名:属性值;...}
            1,html标签选择器
            2,class选择器
            例:div.biaoqian{}只适用于<div class="biaoqian">div区域1</div>
                .biaoqian{}适用于所有的<class="biaoqian"></>
            3,id选择器(id值在页面中是唯一的,id通常都是为了去表示页面的一些特定区域使用的)
            例:div.#id1{}只适用于<div id="id1">div区域2</div>
                #id2{}适用于所有的<id="id2"></>
            优先级:html标记 < class选择器 < id选择器标记 < 标记内属性
            4,扩展选择器
               1,关联选择器(选择器中的选择器)
               例:div b {}只适用于<div><b></b>此区域</div>
               2,组合选择器(对多个标签都这样设置)
               例:body,div,{background-color:#36F;color:#F23;}
               3,伪元素选择器
               例:超链接的状态
                    a:link{}//未访问
                    a:hover{}//鼠标移到上面的效果
                    a:action{}//点击效果
                    a:visited{}//访问后效果
                    p:first-line 段落的第一行文本
                    p:first-letter{}段落中的第一个字母
                    input:focus具有焦点的元素



                        

  • 相关阅读:
    gulp-rev:项目部署缓存解决方案----gulp系列(六)
    nodemailer实现node发送邮件
    angular项目总结——angular + browserify + gulp + bower + less 架构分享
    作为面试官之后的一些体会
    前端乱炖,总结一些细节点
    webapp,liveapp: 流式布局和rem布局
    canvas剪裁图片并上传,前端一步到位,无需用到后端
    (高德地图)marker定位 bug 解决总结
    gulp-clean----gulp系列(五)
    APUE-文件和目录(一)
  • 原文地址:https://www.cnblogs.com/lzzhuany/p/4512023.html
Copyright © 2020-2023  润新知