段落样式

涉及多个文字的排版效果，与字体样式注重个体不同，段落样式注重整体

文本修饰（text-decoration）

定义段落文本的下划线

text-decoration:属性值;

属性可选值	描述
none	无下划线样式，默认值
underline	下划线
line-through	删除线
overline	顶画线

大小写（text-transform）

用来转换文本的大小写（针对英文字符）

text-transform:属性值;

属性可选值	描述
none	无转换
uppercase	转换为大写
lowercase	转换为小写
capitalize	将英文单词首字母大写

文本缩进（text-indent）

定义段落的首行缩进
通常我们使用4个"&nbsp"来缩进首行文本，但是当段落很多的时候，冗余的代码将会很多

text-indent:像素值;

一般来说，我们会将首行缩进定义为两个字的间距，要实现这一效果我们只需要将上面的像素值设置为2倍font-size值即可

文本对齐方式（text-align）

设置文本水平方向的对齐方式,，同时适用于文字元素和图片元素

text-align:属性值;

属性可选值	描述
left	左对齐，默认
right	右对齐
center	居中对齐

行高（line-height）

用于设置每行文本的高度

line-height:像素值;

一个小demo

<!DOCTYPE html><html lang="en">
<head><meta charset="UTF-8"><title>这是一个html5 demo</title><style>p{font-size: 20px;}</style></head>
<body><p style="text-decoration: underline;">这是一个段落</p><p style="text-transform: uppercase;">This is a paragraph</p><p style="text-indent: 40px;">这是一个段落</p><p style="text-align: center;">这是一个段落</p><p style="line-height: 30px; text-decoration: line-through;">这是一个段落</p><p style="text-decoration: underline;">这是一个段落</p></body>
</html>

Chrome浏览器运行结果

css基础--段落样式相关推荐

[19/06/05-星期三] CSS基础_样式表的位置(内联、内部、外部样式)、块元素(div)、内联元素(span)、常用的选择器...
一.概念 CSS(Cascading Style Sheets,层叠样式表) 可以用来为网页创建样式表,通过样式表可以对网页进行装饰. 所谓层叠,就是可以将整个网页想象成是一层一层的结构,层次高的将会 ...
css 设置段落样式各种设置方式详细解释
我本来打算告诉你当你不在我身边的这段日子里我遇到的所有糟糕事但最后我只想告诉你我很想你设置段落样式今天我们详细讲讲设置段落样式的方式: 网页的排版离不开对文字段落的设置,这里主要讲述常用的 ...
CSS基础（样式声明、引用（行内样式、内部样式、外部样式、导入样式）、样式优先级）
目录什么是CSS 为什么使用css css样式规则 css引用(行内.内部.外部link链入.导入式@import) css三种使用方法的区别 ***网页三大元素*** ***什么是CSS*** ...
CSS基础_CSS样式的几种书写形式
1.内嵌式将CSS代码集中写在HTML文档的head头部标签中,并且用style标签定义,其基本语法格式如下: <head> <style type="text/CSS& ...
css基础：样式之定位、样式之隐藏、二级菜单、多个列表转表格、图片精灵技术
<html lang="en"> <head> <meta charset="UTF-8"> <tit ...
css基础：样式之定位、样式之隐藏、二级菜单、多个列表转表格、图片精灵技术...
<html lang="en"> <head> <meta charset="UTF-8"> <tit ...
CSS 文章段落样式
#adiv p { text-align: left; text-indent: 2em; line-height:25px; font-family:微软雅黑; font-size:medium; ...
html文字段落设置,css中怎么设置段落样式？
段落是文章的基本单位,也是网页的基本单位.段落的放置与效果的显示会影响到页面的布局和风格.CSS样式提供了多种属性,来实现对页面中段落文本的控制. css设置段落样式的方法: 对齐方式通过 text- ...
HTML基础，CSS基础
目录 HTML基础标签 1.文本格式化,图片,音频,视频,链接标签列表(有序,无序,自定义) 表格 1.表格(基本使用) 2.表格(合并单元格) 表单 1.input基本使用 2.表单占位符,单选 ...

css基础--段落样式

目录

段落样式

文本修饰（text-decoration）

大小写（text-transform）

文本缩进（text-indent）

文本对齐方式（text-align）

行高（line-height）

一个小demo

css基础--段落样式相关推荐

最新文章

热门文章