投稿
  1. 125jz首页
  2. 教程
  3. 网页制作

CSS实现段落首字下沉效果的2种方法

江山如画 • • 网页制作 • 阅读 9890

CSS实现段落首字下沉效果的2种方法

CSS实现段落首字下沉效果方法一

在CSS布局中，通过设置首字的大小并向左浮动，从而使得首字与其他字符区别；通过右边距控制首字与其他字符的距离。

#first{font-size:3em;
       font-weight:bold;
       float:left;
       margin-right:20px;
}
<p><span id="first">云</span>计算……</p>

CSS实现段落首字下沉效果方法二

通过伪类设置首字样式

Tips:You can change the code before run.

125jz网原创文章。发布者：江山如画，转载请注明出处：http://www.125jz.com/3414.html

赞 (1)
江山如画江山如画管理团队
0 0 打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2019年3月29日 上午9:45
下一篇 2019年4月3日 上午11:11

99%的人还看了以下文章

  • JS实现开关效果，可单选和组选 网页制作

    JS实现开关效果，可单选和组选

    JS实现的checkbox开关效果，可单个打开开关，也可一次关闭所有或打开所有开关。 <html> <head lang="en"> <meta charset="UTF-8"> <title>JS实现开关效果，可单选和组选|www.125jz.com</title…

    江山如画 江山如画
    2018年7月29日
    1.7K0
  • 实现网页全屏和退出全屏JS代码 网页制作

    实现网页全屏和退出全屏JS代码，多浏览器兼容

    实现网页全屏和退出全屏JS代码，兼容主流浏览器如：谷歌、火狐、360等。   <!DOCTYPE html> <html> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <t…

    江山如画 江山如画
    2019年2月15日
    2.7K0
  • 第15课：最后提示 网页制作

    第15课：最后提示

    祝贺！你已经进入最后一课了！ 我已经学到全部知识了？ 如果你已经学完以上教程，恭喜你，你已经学到了很多关于HTML的知识，并且完全有能力创建自己的网站！不过，你所学到的只是基础知识，还有许多内容需要掌握。但是你已经为进一步学习打下了坚实的基础。 在最后这一课中，我们将给予一些最后提示： 首先，在HTML文档中，应保持正确的顺序与结构。令你的HTML文档具有良…

    江山如画 江山如画
    2018年1月18日
    1.7K0
  • 解决网页中img图片出现多余空白的方案 网页制作

    解决网页中img图片出现多余空白的方案

    网页制作中，不管是table还是DIV+CSS排版时，会遇到浏览器中的图片元素img下出现多余空白的问题，非常常见，如何解决？ <table class=”w1024″ border=”0″ cellspacing=”0″ cellpadding=”0″> <tr> <td colspan=”3″> <img src…

    江山如画 江山如画
    2020年4月16日
    2.6K0
  • html5专题 网页制作

    22个HTML5的初级技巧

    本文总结了22个HTML5的初级技巧，希望能对你进一步学习好HTML5会有所帮助。

    zhrjgy zhrjgy
    2018年3月18日
    9760
  • 第11课：边框（border） 网页制作

    第11课：边框（border）

    边框（border）可以有多种用途，比如作为装饰元素或者作为划分两物的分界线。在设置边框方面，CSS为你提供了无尽选择。border-widthborder-colorborder-style 边框宽度[border-width] 边框宽度由CSS属性border-width定义，其值可以是“thin”（薄）、“medium”（普通）或“thick”（厚）等…

    江山如画 江山如画
    2020年2月25日
    1.5K0

发表回复

登录后才能评论