当前位置 博文首页 > mxd:(5)CSS文本伪类

    mxd:(5)CSS文本伪类

    作者:[db:作者] 时间:2021-08-28 13:23

    (1)first-letter伪类

    用于指定只应用于元素第一个字母的规则。该规则通常用于文章新页面的第一个字符。

    (2)first-line伪类

    用于指定段落第一行与段落其它部分使用不同的格式。


    两个伪类的使用方式通常为:(需要注意的是类名后紧跟“:”,“:”后紧跟伪类名,不要添加空格)

    .类名:first-line { ... } ? ?和 ? ? ?.类名:first-line { ... }


    CSS代码如下:

    .cc:first-line { font-weight: bold; }
    .cc:first-letter { font-size: 34px; }
    HTML代码如下:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
    <html>
    	<head>
    		<meta charset="utf-8" />  
    		<base href="/testsmarty/templates/"></base>
    		<title>文本伪类</title>
    		<link rel="stylesheet" type="text/css" href="text3.css">
    	</head>
    	
    	<body>
    		<fieldset>
    			<legend>没使用伪类的效果:</legend>
    			<p>The CSS WG published two Candidate Recommendations: CSS Writing Modes Level 3 and CSS Shapes Module Level 1; an updated Working Draft: CSS Lists and Counters Module Level 3; and an update to a Recommendation (editorial changes only): CSS Namespaces Module Level 3.</p>
    		</fieldset>
    		<fieldset>
    			<legend>first-letter与first-line</legend>
    			<p class="cc">The CSS WG published two Candidate Recommendations: CSS Writing Modes Level 3 and CSS Shapes Module Level 1; an updated Working Draft: CSS Lists and Counters Module Level 3; and an update to a Recommendation (editorial changes only): CSS Namespaces Module Level 3.</p>
    		</fieldset>
    	</body>
    </html>
    效果图如下:


    cs
    下一篇:没有了