5 
p{display:inline;...}
<p>Hello</p>
p::first-letter{color: red;}

I want to use ::first-letter on that p.But it's a inline element, accroding to W3C, it doesn't work. How to do?

4

3 に答える 3

7

仕様http://www.w3.org/TR/CSS2/selector.html#first-letter:first-letterで定義されているとおり、ブロック要素にのみ適用されます。

必要に応じて、それを機能させるために使用できますdisplay:inline-block。http://jsfiddle.net/fZGFH/1/を参照してください

于 2012-05-01T03:49:59.163 に答える
2

display:inline-block; あなたはあなたのpタグに与えることができます

css display：blockを使用します。そしてdisplay：inline ;、要素のプロパティをブロックからインラインに、またはインラインからブロックに変更することもできます...。

これがあなたがそれをすることができる方法のコードです

 <!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
<!--[if IE]>
  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<style>

  p {
      background:red;
      display:inline-block;
  }

p:first-letter
{
color:black;
    font-size:50px;


}
</style>
</head>
<body>
<p>CSS, short for Cascading Style Sheets, is a language used to control the presentation of HTML and XML documents. A basic CSS document is made out of rule sets. Each rule set starts with a selector, a pattern that matches elements in an HTML or XML document. The selector is followed by a block of ...</p>
</body>
</html>

デモ： -http： //jsbin.com/eponir/4/edit

于 2012-05-01T04:59:41.343 に答える
1

インラインと最初の文字のケースのスタイルは次のとおりです。

p{display:inline-block;}
p:first-letter {color:red}
于 2012-05-01T03:58:38.410 に答える