开发者

In Sass, comments cannot span 2 or 3 lines if it is at the end of line? How to make it work?

开发者 https://www.devze.com 2023-03-01 05:17 出处:网络
If the sass file content is #some-div color: #333 font-size: 17px// This value actually has some issue on WebKit because it makes

If the sass file content is

#some-div
  color: #333
  font-size: 17px    // This value actually has some issue on WebKit because it makes 
                     //   the label a little off centered, and is better if it is 16px.
                     //   But on IE, the font turns out to be rather ugly, so we would 
                     //   use 17px for now since IE has a larger user base

the above will actually fail, because it will complain the indentation is not correct (starting the second line of comments). How might it be solved to have multiple li开发者_开发知识库nes like this? Note: It can be made into all indented the same level as the font-size line (and on top of it), but I'd rather not do it like that in this case.


Sass is very indentation-based. As such, there really is no choice but to either

  • Combine the comment onto the end of the line, which will be huge and unwieldy.
  • Move the comment above or below your line.

The documentation for the indentation syntax covers comments in this section. You might find some of the options useful, for example, you only need to have the first line of the comment with slashes, the rest can be indented, which may be more readable for your purposes. It would look like this then:

#some-div
  color: #333
  font-size: 17px    
  // This value actually has some issue on WebKit because it makes 
    the label a little off centered, and is better if it is 16px.
    But on IE, the font turns out to be rather ugly, so we would 
    use 17px for now since IE has a larger user base.

SCSS is the preferred syntax to use now as all valid CSS is valid SCSS; it also allows for the type of comments you would like (in addition to quite a few very nifty additions such as using &:hover inside of a selector to group your variations on styles more logically).

0

精彩评论

暂无评论...
验证码 换一张
取 消