zoukankan      html  css  js  c++  java
  • 响应式 css

    1、class 样式一般用class,命名:中横线分隔,如:div-logo
    id 一般用于js快速地区别和获取元素,命名:驼峰命名法,如:divLogo (中间首字母大写)

    2、必不可少的图片,用<img>引入;
    可有可无的装饰性图片,可用背景嵌入。

    3、normalize.css与resets.css 都是重置样式,但是normalize.css利用了一些技巧,保证各个浏览器的兼容性。

    4、rem相对参照物为根元素html,当没有设置font-size时,浏览器会有一个默认的rem,1rem=16px,与em是一致的。
    一般设置html{font-size:62.5%;} 即1rem=10px;(10/16*100%)

    5、::selection{background-color:#b3d4fc;text-shadow:none;}设置被选中文字的颜色及无阴影效果。

    6、line-height使用px,不要用rem
    中文版的Chrome (最小的字号12px,如果小于12px,则按照12px来算)1rem=12px, 而英文版的1rem=10px。

    7、相邻同胞选择器
    可选择紧接在另一个元素后的元素,且二者有相同的父级元素 。
    下面选择的是item2和item3.
    HTML代码:
    <ul>
    <li>item1</li>
    <li>item2</li>
    <li>item3</li>
    </ul>
    CSS代码:
    li+li { font-size: 50px; }

    8、display:inline-block;之后,出现空隙,解决方法
    如<ul>
    <li>item1</li>
    <li>item2</li>
    <li>item3</li>
    </ul>
    li{display:inline-block;}
    ul{font-size:0;}
    li{font-size:12px;}

    9、 calc(33.33333% - 3rem);动态计算宽度
    三个divdisplay:inline-block之后,要去掉中间的间隙,还要减去padding值

    10、vertical-align 与line-height ???

    11、css中空格符为0a0
    li:nth-child(1)::before{
    content:"最新公告:0a00a0";
    color:#aaa;
    }
    12 、
    h1一个页面只能有一个
    h2次要于h1
    h3一般是一个段落的标题,后面带有p文字的。

  • 相关阅读:
    linux一键安装filemanager和caddy
    搭建owncloud
    Linux下解压命令大全
    linux虚拟机调整分辨率
    [Javascript] ==与===区别
    [转]ActiveX控件安全初始化之一:实现ISafeObject接口
    C# 温故而知新:Stream篇(—)
    [转]C# 温故而知新:Stream篇(二)
    【转】C# 温故而知新:Stream篇(三)
    [转]在企业应用开发中遵循开源协议
  • 原文地址:https://www.cnblogs.com/annie211/p/6083263.html
Copyright © 2011-2022 走看看