zoukankan      html  css  js  c++  java
  • css样式编辑

    1、剪切:
    clip:rect(a,b,c,d);
    a参数:从顶部开始剪切,多少参数表示腰间切多少;
    b参数:从右边开始剪切,用减法来计算要剪去的多少;(最大的宽度-b参数 = 剪去的参数)
    c参数:从下边开始剪切,用减法来计算要剪去的多少;(最大的高度度-c参数 = 剪去的参数)
    d参数:从顶部开始剪切,多少参数表示腰间切多少;
    2、fixed:
    因为fixed的固定方式是基于html的屏幕采集的尺寸来定位的,所以通过fixed定位的元素可以取到屏幕的高度和宽度;
    都是适应屏幕的
    3、顶部菜单固定:
    应为固定后就脱离正常文档流,会把下面的内容挡住;所以可以为父元素设置padding-top:的值为头部菜单的高度;
    4、自适应宽度和高度:
    在写样式的时候有时候为了使页面能够自适应浏览器的高度和宽度,可以使用position:absolute;、
    然后设置top、bottom、right、left的距离为任意值,中间的位置即为当前所需要的宽度和高度,并且会自适应父级元素的宽度和高度;
    并且因为没有设置宽度和高度所以在使用margin移动位置的时候会改变宽度和高度;
    5、css3:
    calc是英文单词calculate(计算)的缩写,是css3的一个新增的功能,
    你可以使用calc()给元素的border、margin、pading、font-size和width等属性设置动态值;
    例:calc(100%/3-5px);仅是一种可以计算尺寸的方式;


    6、css3:
    box-sizing: 默认值:center-box;就是现有的样式;
    值:border-box;就是在现有的尺寸改变padding 或是border ;
     不会在改变border或padding样式的时候改变现有的尺寸;

    7、css3、
    orientation:portrait | landscape;

    portrait:指定输出设备中的页面可见区域高度大于或等于宽度;
    landscape:除portrait值情况外,都是landscape
    8、css:
    white-space:nowrap;文字不换行,直到遇到br
    text-overflow:ellipsis;超出部分以 ...显示;

    // -o-text-overflow:ellipsis;在o下支持这个效果;
    overflow:hidden; 要对超出部分做隐藏;
    }

    9、 -webkit-text-size-adjust: 100%;ios下横屏字体适应

  • 相关阅读:
    mybatis自学历程(二)
    mybatis自学历程(一)
    Hibernate入门教程(二):Hibernate核心API
    Hibernate入门教程(一):入门示例(Myeclipse)
    Python中反射的简单应用
    Struts2的Action访问
    Myeclipse中dtd代码提示
    B/+、索引原理
    postgres 模糊匹配
    jvm_第三章:垃圾收集与内存分配策略
  • 原文地址:https://www.cnblogs.com/wanb/p/4690059.html
Copyright © 2011-2022 走看看