zoukankan      html  css  js  c++  java
  • 日常忽略的css

    1、calc() 函数:用于动态计算长度值。

      这个函数我没有经常使用,因为我关于宽度的计算,我一般使用百分比,但是这个函数给我一个可以在css也进行计算的功能。calc()函数支持 "+", "-", "*", "/" 运算;很实用。

      eg:  calc( 100% - 100px )

    2、@support:用于检测浏览器是否支持CSS的某个属性,其实就是条件判断,如果支持某个属性,你可以写一套样式,如果不支持某个属性,你也可以提供另外一套样式作为替补

      这个函数我根本就没了解过,失败。这个主要主要在调试浏览器兼容性的时候用处很大

      eg: 

    支持css
    @supports (display: grid) { div { display: grid; } } 不支持css @supports not (display: grid) { div { float: right; } }

    3、@media: 针对不同的媒体类型定义不同的样式,可以针对不同的屏幕尺寸设置不同的样式,特别是如果你需要设置设计响应式的页面。

      这个css我以前做移动端的时候经常使用,但是好长时间不用,竟然给忘记了。不应该。

      eg:

    @media screen and (min-960px){
        body{
            background:orange;
        }
    }
    @media screen and (max- 300px) {
        body {
            background-color:lightblue;
        }
    }
    

      

  • 相关阅读:
    知识的本质
    福克斯保养注意事项及驾驶技巧
    转 网络编程
    Linux系统下安装 apache2.4的过程
    代码静态检查工具PCLint运用实践
    gcc编译系统
    量子计算机:决胜21世纪的利器
    关于ETL工具、方案的认识
    《HTTP: The Definitive Guide》读书笔记
    ArrayList(转用法)
  • 原文地址:https://www.cnblogs.com/liumcb/p/13323899.html
Copyright © 2011-2022 走看看