css – 将样式表编程为子样式表?

假设你有一个庞大的样式表,其中有一个完整的站点值得选择器,每个都加载了属性(定位,大小,字体,颜色等等)在一起),你想将它们分成不同的适当的文件(例如字体.css,colors.css,layout.css等).. ..

是否有任何已知(自动)完成此类任务的方法

例:

#myid {
display:block;
width:100px;
height:100px;
border:1px solid #f00;
background-color:#f00;
font-size:.75em;
color:#000;
}

将转换为以下3个文件

layout.css中:

#myid {
    display:block;
    width:100px;
    height:100px;
}

color.css:

#myid {
    border:1px solid #f00;
    background-color:#f00;
    color:#000;
}

fonts.css:

#myid {
    font-size:.75em;
}

我的例子可能没有使用最好的约定来做到这一点,但是一种自动属性分离成不同文件方法在框架创建中将是非常方便的,我想象.

解决方法

这应该让你开始:
#!/usr/bin/env python
import cssutils

PATH_TO_CSS_FILE = 'old_huge_css_file.css'

LAYOUT = ('display','width','height','margin','padding','position','top','left','bottom','right')
COLOR = ('color','background','border','background-color')
FONTS = ('font','font-size')

def strip_styles(infile_path,outfile_path,properties_to_keep):
    stylesheet = cssutils.parseFile(infile_path)

    for rule in stylesheet:
        if not rule.type == rule.STYLE_RULE:
            continue

        [ rule.style.removeProperty(p) for p in rule.style.keys() 
            if not p in properties_to_keep ]

    f = open(outfile_path,'w')
    f.write(stylesheet.csstext)
    f.close()

segments = (
    ('layout.css',LAYOUT),('color.css',COLOR),('fonts.css',FONTS),)

for segment in segments:
    strip_styles(PATH_TO_CSS_FILE,*segment)

你需要CssUtils

显然,我一开始就没有用一切可能的CSS属性来填充元组.我会把这个作为一个练习留给读者

注意:即使它们中的许多不符合分离的样式,它也将留下样式表中的所有注释.

此外,顶部的LAYOUT,COLOR和FONTS变量中未列举的所有样式都将被过滤掉.

您可以轻松地修改strip_styles函数,以过滤掉这三个变量中的样式,使第四个样式表包含所有的misc.属性如果你喜欢

相关文章

Css3如何实现鼠标移上变长特效?(图文+视频)
css3怎么实现鼠标悬停图片时缓慢变大效果?(图文+视频)
jquery如何实现点击网页回到顶部效果?(图文+视频)
css3边框阴影效果怎么做?(图文+视频)
css怎么实现圆角边框和圆形效果?(图文+视频教程)
Css3如何实现旋转移动动画特效