无法在<input />元素上使用的after after元素上设置font-weight

时间:2013-08-09 15:04:20

标签: html css css3 pseudo-element css-content

所以,我在输入元素上有一个自定义样式,我希望使用:after在输入上放置一些文本。

我遇到的问题是我似乎无法更改:after元素上的字体粗细,只有input:after元素的组合才会出现此问题

CSS

input[type="checkbox"] { /* enable styling of the checkbox ! */
    -moz-appearance: none;
    -webkit-appearance: none;
}

input { /* set up some basic styles.... */
    background-color:#ccc;
    width:200px;
    height:200px;
    background-color:grey;
}

input:after { /* and we create the :after element */
    width:100%;
    text-align:center;
    font-weight:100; /* THIS DOESN'T WORK FOR SOME REASON */
    content: "This should be thin"; /* some text */
}

的jsfiddle

http://jsfiddle.net/xQVfL/1/

测试

Chrome for mac(最新)

问题

为什么我不能在:after元素的input元素集上设置font-weight?

1 个答案:

答案 0 :(得分:2)

这是在这里得到的答案。似乎:之后只打算附加到容器标签。 Can I use the :after pseudo-element on an input field?