HTML/CSS之段落排版

段落排版之首行缩进

中文文字中的段前习惯空两个文字的空白,这个特殊的样式可以用下面代码来实现:

p{text-indent:2em;},在head头里面写上下面的代码

<style type="text/css">
p{text-indent:2em;}
</style>
<strong>注意:2em的意思就是文字的2倍大小。</strong><span style="color:#FF0000;">text-indent</span>就是缩进的意思

段落排版之行间距

<span style="font-size:18px;"><strong><span style="color:#FF0000;">p{line-height:1.5em;}</span></strong></span>

段落排版--字间距、字母间距

如果想在网页排版中设置文字间隔或者字母间隔就可以使用 letter-spacing来实现

h1{letter-spacing:20px};

如果我想设置英文单词之间的间距呢?可以使用word-spacing来实现。如下代码:

h1{word-spacing:20px;}

段落排版--对齐

想为块状元素中的文本、图片设置居中样式吗?可以使用text-align样式代码

<style type="text/css">

div{text-align:center;}text-align的意思就是文本-对齐,后面可以是left,right,center.

</style>

时间: 2024-10-28 19:25:41

HTML/CSS之段落排版的相关文章

CSS文字段落排版常用设置

.firstp { /* 文字排版:颜色.字号.字体.粗体.斜体.下划线.删除线 */ color: #666; /*颜色*/ font-size: 30px; /*字号*/ font-family: "宋体"; /*字体*/ font-weight: bold; /*粗体*/ font-style: italic; /*斜体*/ text-decoration: underline; /*下划线 删除线用:line-through*/ /* 段落排版:缩进.行高.文字距离.单词间距.

Bootstrap全局CSS样式之排版

Bootstrap能完全友好的支持html5的文本元素,这里不再赘述,具体可参考我另一篇文章<html的文本元素总结>,这里主要针对Bootstrap封装好的CSS文本样式做一下汇总. .small--当前元素字体大小的 85%,常用作副标题时,也可用<small>来代替: .lead--让段落突出显示; .text-left..text-center..text-right--将文字于左.居中.于右对齐: .text-lowercase..text-uppercase..text

div+CSS实现段落首行缩进两个字符

段落前面空两个字的距离,不要再使用空格了,用CSS实现段落首缩进两个字符.应该使用首行缩进text-indent.text-indent可以使得容器内首行缩进一定单位.比如中文段落一般每段前空两个汉字. 在这里我们需要了解一种长度单位em.em是相对长度单位.相对于当前对象内文本的字体尺寸.我们中文段落一般每段前空两个汉字.实际上,就是首行缩进了2em. <style type="text/css"><!-- p{text-indent: 2em; /*em是相对单位

用css控制段落

网页要求:两个段落  第一个段落有一句话为红色 另一整个段落文字颜色为蓝色  一个有上划线一个有下划线 段落前空两格 前面一段文字之间的间隔为5px,后面一段文字之间间隔为10px;两个段落文本方向相反. <html> <head> <title>用css控制段落</title> <style> #test1{ text-indent:40px; text-align:left; letter-spacing:5px; text-decorati

Div+Css实现段落首行缩进两个字符(text-indent标签)

段落前面空两个字的距离,不要再使用空格了,用CSS实现段落首缩进两个字符.应该使用首行缩进text-indent.text-indent可以使得容器内首行缩进一定单位.比如中文段落一般每段前空两个汉字. 在这里我们需要了解一种长度单位em.em是相对长度单位.相对于当前对象内文本的字体尺寸.我们中文段落一般每段前空两个汉字.实际上,就是首行缩进了2em. <style type="text/css"> p{ text-indent: 2em; /*em是相对单位,2em即现

div+css是网页排版技巧_html/css_WEB-ITnose

div+css是网页排版技巧_html/css_WEB-ITnose 以下是兄弟连培训总结的一些技巧,留下备用,希望对看到的人有用~~ 1,ul:默认的ul的margin和padding不是0,如果在导航中用到了左浮动的li,往往会把外部的div撑大,导致页面变形,改成: ul{margin:0px; padding:0px;} 2.img:1.这里牵涉的不同浏览器的问题,ie6里显示的图片height总是要大于准确值,这里就需要我们记住下面这一点 img{ display:block}:2.页

CSS控制段落首字母放大显示

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>石家庄伸缩门</title><

14.段落排版--行间距(行高)

这一小节我们来学习一下另一个在段落排版中起重要作用的行间距(行高)属性(line-height),如下代码实现设置段落行间距为1.5倍. p{line-height:1.5em;} <p>菲茨杰拉德,二十世纪美国文学巨擘之一,兼具作家和编剧双重身份.他以诗人的敏感和戏剧家的想象为"爵士乐时代"吟唱华丽挽歌,其诗人和梦想家的气质亦为那个奢靡年代的不二注解.</p>

Web前端开发基础 第四课(CSS文字和段落排版)

文字排版--字体 我们可以使用css样式为网页中的文字设置字体.字号.颜色等样式属性.下面我们来看一个例子,下面代码实现:为网页中的文字设置字体为宋体. body{font-family:"宋体";} 这里注意不要设置不常用的字体,因为如果用户本地电脑上如果没有安装你设置的字体,就会显示浏览器默认的字体.(因为用户是否可以看到你设置的字体样式取决于用户本地电脑上是否安装你设置的字体.)现在一般网页喜欢设置“微软雅黑”,如下代码: body{font-family:"Micro