Css轻松实现网页文字首字下沉
Admin | 2007-11-18 23:38:46 | 被阅次数 | 8890
在使用WORD编辑文章的时候，众多网友曾为首字下沉效果而惊叹不已，但其操作却简单得实在不敢恭维！
那么，在网页制作中，如何实现首字下沉效果呢
呵呵，网页制作不比WORD文章编辑，不可一蹴而就，得使用CSS来完成！
以上为代码：
<head>
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<title>CSS首字下沉</title>
<style type="text/css">
.dyfirst {
width:300px;
border:1px solid #ddd;
padding:5px;
font-size:12px;
margin:5px 0;
}
.dyfirst:first-line {
color:#050;
}
.dyfirst:first-letter {
font-size:300%;
font-weight:bold;
color:#000;
float:left;
}
</style>
</head>
<body>
<div class="dyfirst"> Ewww.bookit.cn<br />
www.bookit.cn<br />
www.bookit.cn</div>
<div class="dyfirst"> 大众计算机学习网<br />
众计算机学习网<br />
众计算机学习网</div>
</body>
</html>
试试吧，也挺简单滴！