zoukankan      html  css  js  c++  java
  • CSS 常用属性

    1. 使用Web字体

    @font-face {
        font-family: Delicious;
        src: url('/Delicious-Roman.otf')
    }

    然后调用该字体: 
    h3 { font-family: Delicious, sans-serif; }

    在IE中显示为

    2. 规定添加到文本的修饰

    text-decoration: none

    none    默认。定义标准的文本

    underline   定义文本下的一条线

    overline   定义文本上的一条线

    line-through 定义穿过文本的一条线

    blink    定义闪烁的文本

    3. 增加或减少字符间的空白(字符间距)

    h1 {letter-spacing: -0.5em}

    h2 {letter-spacing: 20px}

    在IE中显示为

    normal:  默认。规定字符间没有额外的空间

    length:   定义字符间的固定空间(允许使用负值)

    inherit

    4. 设置字体的尺寸

    font-size: 200%

    medium:  默认值

    smaller:   设置为比父元素更小的尺寸

    larger:    设置为比父元素更大的尺寸

    length:   设置为一个固定的值

    %:      设置为基于父元素的一个百分比值

    inherit

    5. 规定元素中的文本的水平对齐方式http://www.w3school.com.cn/css/pr_text_text-align.asp

    text-align: left;  把文本排列到左边。默认值:由浏览器决定。

    right  把文本排列到右边

    center   把文本排列到中间

    justify    实现两端对齐文本效果

    inherit

    6. 设置所有外边距属性(依次为上右下左)

    margin: 10px 5px 15px 20px

    margin: 10px  表示4个外边距都是10px

      

    7. 设置所有内边距属性(依次为上右下左)

    padding: 10px 5px 15px 20px;

    padding-left: 20px;

    8. 设置元素的背景颜色 

    backgound-color: yellow

    9. 设置所有的边框属性

    border: 1px dashed #aaaaaa;

    10. 这是边框样式

    border-style: dotted dolid double dashed;  表示上边框是点状 右边框是实线 下边框是双线 左边框是虚线

    和margin属性顺序一样

    border-style: dotted;  所有4个边框都是点状

    11. 规定元素应该生成的框的类型

    display: inline;  默认。此元素会被显示为内联元素,元素前后没有换行符

    none:       此元素不会被显示

    block:       此元素会被显示为块级元素,此元素前后带有换行符

    inherit:      规定应该从父元素继承display属性的值

    12. 设置表格的边框是否合并为一个单一的边框

    table {

      border-collapse: collapse;

    }

    siparate   默认值。边框会被分开。不会忽略border-spacing和empty-cells属性

    collapse   如果可能,边框会合并为一个单一的边框。会忽略border-spacing和empty-cells属性

    inherit

    13. 设置背景图像http://www.w3school.com.cn/css/pr_background-image.asp

     background-image: url(bgimage.gif);

     background-repeat: none(默认值)  根据此值,可以设置图像无线平铺或者不平铺等。

    14. 规定元素的定位类型

    h2.pos_left
    {
    position:relative;
    left:-20px
    }
    h2.pos_right
    {
    position:relative;
    left:20px
    }

    在IE中显示为

    static  默认值。没有定位,元素出现在正常的流中(忽略top,bottom,left,right或者z-index声明)

    absolute:     生成绝对定位的元素,相对于static定位以外的第一个父元素进行定位。元素的位置通过"left","top","right"以及"bottom"属性进行规定

    fixed:       生成绝对定位的元素,相对于浏览器窗口进行定位。元素的位置通过"left","top","right"以及"bottom"属性进行规定。

    relative:       生成相对定位的元素,相对于其正常位置进行定位。因此,"left: 20"会向元素的LEFT位置添加20像素。

    inherit

    15. 定义元素在哪个方向浮动

    float: none;  默认值。元素不浮动,并会显示在 其在文本中出现的位置

    left:  元素向左浮动

    right:  元素向右浮动

    inherit

    expression用法 : 

    expression(document.body.clientWidth);

    height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight);

    top: expression(document.body.clientHeight / 2 - this.offsetHeight / 2);

    left: expression(document.body.clientWidth / 2 - this.offsetWidth / 2);

  • 相关阅读:
    shell安装kettle
    shell安装jdk
    shell脚本之系统初始化设置(设置selinux、设置ulimit、设置firewalld、设置time_zone)
    关闭防火墙
    todo的使用
    Android Dagger2.0 学习一下
    Android零碎知识点
    windows7 服务中上找不到mysql
    AS 3.1 多library合并打包成aar的正确方式(fat-aar)
    Alexander的Python机器学习 之目录分析。
  • 原文地址:https://www.cnblogs.com/studyhs/p/2672860.html
Copyright © 2011-2022 走看看