首页 教程 API文档

css操作

2015-12-13 16:16:37

属性


使用频率 中高
复杂程度
成员类型 静态模块

描述


Std.css是有关css操作方面的总模块,其中子模块包含了pseudos,selector等.

Std.css模块的本身可以对浏览器的css规则进行读写操作.

在创建Std.css模块实例的时候,如果直接执行Std.css({...})与 new Std.css({..}),是完全一样的,当直接执行的时候,Std.css方法内部会自动创建实例对象,并且作为返回值返回.

同时,Std.css实例对象在被创建之后,还会自动创建一个style标签插入到head中.

成员列表


方法名称 成员类型 描述
::pseudos static css伪类
::selector static css选择器模块
::support static 判断是否支持指定名称css属性
::keyframes static css keyframes规则操作
append public 添加css规则
clear public 清空css规则
enable public 启用禁用css规则
insert public 插入css规则
length public css规则长度
remove public 删除css规则
source public 读取css规则源码

语法



Object Std.css(Object cssRules);
Object Std.css(Object cssRules,Object appendTo);
Object Std.css(Object cssRules,String appendTo);
        

参数


名称 类型 描述
cssRules Object css规则,这个参数可以是一个函数,但是该函数的返回值必须是css规则
appendTo Object,String 需要将style元素插入到的地方,可以是一个DOM对象,或者是css选择器,也可以不是用该参数,默认插入到head中

返回值


Std.css实例对象

相关例子


js代码


Std.css({
    ".content":{
        color:"red",
        '>':{
            p:{
                lineHeight:"1.5em"
            },
            ".title":{
                fontSize:"36px",
                color:"black"
            }
        },
        ' ':{
            span:{
                color:"red"
            }
        }
    },
    ".footer > ._information":{
        height:"80px",
        color:"gray"
    },
    "#button":{
        border:"1px solid green",
        background:"blue"
    }
});
        

上面的代码作用相当于如下css代码


.content{
    color: red;
}
.content span{
    color: red;
}
.content > .title{
    font-size: 36px;
    color: black;
}
.content > p{
    line-height: 1.5em;
}
.footer > ._information{
    height: 80px;
    color: gray;
}
#button{
    border: 1px solid green;
    background: blue;
}