19阅读网  |  最近更新  |  TAG  | 
19阅读网
当前位置:首页 > html段落首行缩进

html段落首行缩进

来源:互联网 时间:2017-07-13 阅读: 手机版

篇一:html段落首行缩进

CSS text-indent段落首行文字缩进 - DIVCSS5欢迎来到DIVCSS5查找CSS资料与学习DIV CSS布局技术!DIVCSS5培训 系统快速学会CSS布局技术!您的位置: > >

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

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

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

.p>

这里对象内段落首行开头文字缩进了25。

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

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

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

1、CSS代码

.p>

2、HTML代码片段

p> br /  使用的换行将不会缩进  /p   p 第二段使用段落首行也会缩进 br /  第二行使用了不会缩进 br /  第三行提行使用了br也不会缩进 /p   /p>

3、段首缩进案例截图

p></p><p> text-indent文本段落缩进应用案例截图</p>三、首行段落文字缩进text-indent总结   -   <p>我们要让每段文字开头缩进,并且可以控制缩进距离我使用text-indent缩进单词。如果不想使用text-indent样式进行缩进,我可以使用空格来实现,但需要多打几个  实现空格字符占位缩进,你可以详细了解应用。</p><p>如需转载,请注明文章出处和来源网址:</p>我要分享到:上一篇: </p><p>下一篇: 必备CSS教程 Essential CSS Tutorials       ()  () ()           必备HTML基础教程 Essential HTML Tutorials  () () ()  ()                          ()          <p> </p>最新文章NEWS          相关文章RELATED          CSS EFFECTS / CSS MODULE<img src=DIV+CSS分页_CSS翻页代码模板css form实例 用CSS实现表单form布局实例经典DIV+CSS下拉菜单p><img src= - - - - - 学习,找资源上DIVCSS5! DIVCSS5.com 学习与资源分享平台

篇二:html段落首行缩进

段落前面空两个字的距离,不要再使用空格了,用CSS实现段落首缩进两个字符。应该使用首行缩进text-indent。text-indent可以使得容器内首行缩进一定单位。比如中文段落一般每段前空两个汉字。

在这里我们需要了解一种长度单位em。em是相对长度单位。相对于当前对象内文本的字体尺寸。我们中文段落一般每段前空两个汉字。实际上,就是首行缩进了2em。

style type="text/css"

!--

p{

text-indent: 2em; /*em是相对单位,2em即现在一个字大小的两倍*/

}

--

/style

p 段落前面空两个字的距离,不要再使用空格了。应该使用首行缩进text-indent。长度单位em。相对于当前对象内文本的字体尺寸。我们首行缩进了2em。2em即现在一个字大小的两倍。

/p

-----------------------------------------------------------------------------------------------------------------

用CSS实现段落首缩进两个字符,实现首行缩进的通用方法是加四个小角空格。

其实呢,用CSS样式来定义更为高效。

比如在style里定义如下缩进样式:.suojin{text-indent:2em}

在需要缩进的地方使用 即可,比如用一个p>

凡在p>

也可以在正文中使用嵌入式CSS样式来定义,下面举个实例(使用时请将尖括号改为小角尖括号):

<p>

<p>段落一</p>

<p>段落二</p>

<p>段落三<p>

</p>

两种方法各有长处短处,可根据需要决定使用哪一种方法。

注:p>

篇三:html段落首行缩进

!DOCTYPE HTML

html

?? ?? head

?? ?? ?? ?? meta http-equiv="Content-Type" content="text/html; charset=utf-8"

?? ?? ?? ?? title 认识html标签 /title

?? ?? ?? ?? style type="text/css"

?? ?? ?? ?? ?? ?? ??p{text-indent:2em}??

?? ?? ?? ?? /style

?? ?? /head

?? ?? body

?? ?? ?? ?? h1 勇气 /h1

?? ?? ?? ?? p 三年级时,我还是一个胆小如鼠的小女孩,上课从来不敢回答老师提出的问题,生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。

/p

?? ?? ?? ?? p 到了三年级下学期时,我们班上了一节公开课,老师提出了一个很简单的问题,班里很多同学都举手了,甚至成绩比我差很多的,也举手了,还说着:"我来,我来。"我环顾了四周,就我没有举手。

/p

?? ?? ?? ?? img src="http://img.mukewang.com/52b4113500018cf102000200.jpg"

?? ?? /body

/html

猜你喜欢

最新文章

热门文章