【问题标题】:What is the meaning of the symbol '/'?符号“/”是什么意思?
【发布时间】:2014-05-11 10:35:30
【问题描述】:

我正在寻找符号/ 的含义。我用谷歌搜索它没有任何成功。

你可以在任何地方找到,但在这里an example from today

#identity:before
{
    /* some useless stuffs */
    border-radius: 30% 0% 30% 0%/75% 0% 75% 0%;
}

我已经看到它带有 font-size 属性。

我不确定这个问题是否属于这里。说我,如果我必须移动它。

谢谢。

更新

Chris Bpostlink关于font-size的情况。

font: 12px/18px

意思:

font-size: 12px;
line-height: 18px;

这是一个简写。现在,border-radius 有什么意义?

【问题讨论】:

  • 我正要说是给cmets的,然后我看到那个鬼鬼祟祟的小混蛋躲在百分比里。
  • @ChrisB 我学到了一些东西!但是边界半径有什么意义呢?我将编辑我的答案。

标签: css


【解决方案1】:

CSS 语法有三种类型的列表元素分隔符:

  • '/'(斜杠)
  • ' '(空格)
  • ','(逗号)

所以上面的border-radius可以用LISP风格写成这样:

(30% 0% 30% 0%) (75% 0% 75% 0%); 

两个元素的列表,其中每个元素本身就是四个元素的列表。

很遗憾,CSS 语法与此分隔符的优先级不一致。 在border-radius 属性中,' ' 的优先级高于'/',但在字体声明中的优先级不同,因此:

font:italic bold 12px/30px Georgia, serif;

被解析为这个

font:italic bold (12px 30px) (Georgia serif); 

【讨论】:

    【解决方案2】:

    "如果在斜线之前和之后给出值,那么斜线之前的值设置水平半径,斜线之后的值设置垂直半径。如果没有斜线,那么值设置两个半径平等。”

    您帖子中代码中的斜杠是简写,用于区分垂直半径和水平半径。

    http://www.w3.org/TR/css3-background/#border-radius

    从上面的链接:

    border-radius: 4em;
    

    等价于

    border-top-left-radius:     4em;
    border-top-right-radius:    4em;
    border-bottom-right-radius: 4em;
    border-bottom-left-radius:  4em;
    

    border-radius: 2em 1em 4em / 0.5em 3em;
    

    等价于

    border-top-left-radius:     2em 0.5em;
    border-top-right-radius:    1em 3em;
    border-bottom-right-radius: 4em 0.5em;
    border-bottom-left-radius:  1em 3em;
    

    【讨论】:

    • 一个基本的 RTFM。该死。谢谢!
    • @aloisdg 没问题!很高兴我能帮上忙!
    猜你喜欢
    • 2011-04-07
    • 1970-01-01
    • 1970-01-01
    • 2022-12-22
    • 2010-09-29
    • 2011-04-18
    • 1970-01-01
    • 2020-04-02
    • 2019-11-17
    相关资源
    最近更新 更多