zoukankan      html  css  js  c++  java
  • CSS text-indent段落首行文字缩进

    DIV CSS text-indent段落首行文字缩进CSS段首缩进,可控制缩进距离样式教程篇

    让每个段落首行开头文字缩进,如缩进2个文字距离样式,我将用到text-indent属性样式。

    一、text-indent缩进语法与结构   -   TOP

    .divcss5{text-indent:25px}
    这里divcss5对象内段落首行开头文字缩进了25像素

    css text-indent文本缩进样式属性单词,text-indent的值跟数字+单位组成缩进样式。

    二、css段落段首文字缩进案例   -   TOP

    通常text-indent缩进属性将对段落首行开头文本文字进行缩进显示。如果使用html br换行标签,第二个换行开始也不会出现缩进效果。如果使用了html P段落标签段落换行,将会出现每个p段落换行开头都将缩进,这里我们给大家通过案例演示给大家,希望通过DIVCSS5案例掌握CSS text-indent缩进样式。

    1、CSS代码
    .divcss5{ text-indent:35px}

    2、HTML代码片段

    <div class="divcss5"> 
    <p>第一段开始缩进效果<br /> 
    使用br标签的换行将不会缩进 
    </p> 
    <p>第二段使用p标签段落首行也会缩进<br /> 
    第二行使用了br不会缩进<br /> 
    第三行提行使用了br也不会缩进</p> 
    </div> 

    3、段首缩进案例截图

    div+css text-indent段落首行文字缩进应用案例截图
    div+css text-indent文本段落缩进应用案例截图

    三、首行段落文字缩进text-indent总结   -   TOP

    我们要让每段文字开头缩进,并且可以控制缩进距离我使用text-indent缩进单词。如果不想使用text-indent样式进行缩进,我可以使用空格来实现,但需要多打几个html空格字符&nbsp;”实现空格字符占位缩进,你可以详细了解html多空格字符应用。

    如需转载,请注明文章出处和来源网址:http://www.divcss5.com/rumen/r400.shtml

  • 相关阅读:
    9.17考试
    Something
    tesuto-Mobius
    7.22考试
    填坑...P1546 最短网络 Agri-Net
    P1125 笨小猴
    P2822 组合数问题
    致我们曾经刷过的水题
    Luogu P1186 玛丽卡
    Luogu P1726 上白泽慧音
  • 原文地址:https://www.cnblogs.com/lst619247/p/13203742.html
Copyright © 2011-2022 走看看