简单CSS,实现“首字下沉”效果!

转载 2006年06月14日 14:45:00

来自经典论坛

 
<html>
<head>
<title>首字下沉</title>
<style>
body{
      font-size:12px;
      line-height:1.5;
}
#first:first-letter{
    float:left;
    font:bold 30px "黑体";
    color:#690;
}
</style>
</head>
<body>
<div id="first">中新网6月13日电 今日出版的香港《大公报》从北京发回的报道称,履新不久的国家统计局局长邱晓华在北京大学指出,中国经济保持了快速、健康的发展势头,在“十一五”末期,中国经济很有可能赶上德国。

 

十二日傍晚,邱晓华在北京大学金融与证券研究中心组织的第55期“天相金融与经济高级论坛”发表主题演讲。虽然大雨滂沱,但这位年轻有为的国家统计局局长,吸引了不少北大学子,偌大的报告厅内座无虚席,不少学生只好席地而坐。</div>
</body>
</html>

相关文章推荐

css first-letter实现首字(字母)下沉效果

css 首字下沉效果原理 首字下沉主要使用到css的first-letter伪元素,然后配合使用font-size和float来设置文字的样式即可实现。 first-letter选择器选取指定元素...

CSS制作首字下沉

在杂志排版中,常常能看到首字下沉的效果。 在Web的排版中,也常常能看到上图这样的效果。并且常常看到的是首段首字下沉。那么今天这篇文章咱们来聊聊如何使用CSS实现首字下沉效果。::first-l...
  • LuviaWu
  • LuviaWu
  • 2017年03月16日 19:10
  • 229

44-首字下沉效果的设置

无标题文档 span{ font-size:2em; float:left; margin:5px; font-weight:bolder; } img{ float:right; ...

段落首字大写下沉

  今天要讲的内容是如何实现“首字下沉”,,第一个字是很大的红色楷体,陷于一段文字之首。这种做法在杂志中常见,但是在网页中不那么常见。那么如何实现呢?其实很简单,只有一句CSS就可以了。  Selec...
  • nighted
  • nighted
  • 2011年06月25日 16:37
  • 3528

简单说 通过CSS的滤镜 实现 火焰效果

说明上次我们了解了一些css滤镜的基础知识, 简单说 CSS滤镜 filter属性 这次我们就来用css的滤镜实现一个 火焰的效果。 解释 要实现上面的火焰效果,我们先来了解一些必要的东西。...
  • FE_dev
  • FE_dev
  • 2017年10月27日 14:51
  • 55892

html+css实现简单分页页码效果

  • 2015年04月19日 17:59
  • 1KB
  • 下载

用css3实现简单的进入效果

这是一个比较简单的小例子,实现如图效果 仅仅用css3就可以达到这种效果,代码如下: .div { position: relative; top: 20px; h...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:简单CSS,实现“首字下沉”效果!
举报原因:
原因补充:

(最多只允许输入30个字)