dongyong5255
dongyong5255
2011-08-18 02:56
浏览 103
已采纳

CSS选择器的正则表达式 - PHP

Does anyone know what the most robust regex would be to select all selectors from a css declaration? Below is CSS code for non-standard CSS that would be a good test case.

.somenormalstyledeclaration 
{
    width:100%;
    height:100%;
    background-image: url(images/fallback-gradient.png);
}
.somenormalstyle1, .somenormalstyle2 
{
    width:100%;
    height:100%;
    background-image: url(images/fallback-gradient.png);
}
.gradient-bg 
{
   background-color: #1a82f7;
   background-image: url(images/fallback-gradient.png);
   background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#2F2727), to(#1a82f7));
   background-image: -webkit-linear-gradient(top, #2F2727, #1a82f7);
   background-image:    -moz-linear-gradient(top, #2F2727, #1a82f7);
   background-image:     -ms-linear-gradient(top, #2F2727, #1a82f7);
   background-image:      -o-linear-gradient(top, #2F2727, #1a82f7);
}

@-webkit-keyframes bounce_circle 
{
    0% 
    {
        opacity:0.3;
    }
    50% 
    {
        opacity:1;
        background-color:#111
    }
    100% 
    {
        opacity:0.3;
    }
}
  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

2条回答 默认 最新

  • douhuang2673
    douhuang2673 2011-08-18 04:01
    已采纳

    This should work mostly. It's a few steps, but not as good as a full parser.

    1. Replace all newlines with a space character
    2. Assuming you never use strings including { or }, you can replace /\{[^\}]\}/ with a ,
    3. Split all the text into an array on each , and ; character
    4. Trim all whitespace from the beginning and end of each selector

    Every element of the array should be a selector or an "at-rule" (i.e. @charset utf-8;).

    I have probably missed some other edge cases, but this should work as a quick-and-dirty solution for most cases.

    点赞 评论
  • dongyimo1293
    dongyimo1293 2014-04-10 08:07

    While this doesn't deal with the @-webkit... it does yeild just ID and Class selectors.

    I'm sure a regex wizard can be more efficient...

    This link helped point the way. Even though it's javascript, I was able to get the gist.

    // Snag file
    $text = file_get_contents("file.css");
    
    // Strip comments
    $text = preg_replace('!/\*.*?\*/!s', '', $text);
    
    // Clear out everything between brackets
    $text = preg_replace('/{(.*?)}/si', '', $text);
    
    // Get ID and class selectors
    $pattern = '/([#|\.])([_a-z]+[_a-z0-9-]*)/mi';
    
    // Array to store results.
    $result = array();
    
    // No "g' modifier in PHP, use preg_match_all for this kind of behaviour.
    preg_match_all($pattern, $text, $result);
    
    print "<pre>";
    print_r ( $result );
    print "</pre>";
    
    点赞 评论

相关推荐