html如何缩进对齐,CSS:文本样式(缩进/对齐/字符间隔/文本装饰/空白格处理)_html/css_WEB-ITnose...

CSS 文本

(一)首行数字缩进

首行缩进5em的段落。这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容

(二)首行数字缩进为负值

首行缩进-5em,padding-left=5em的段落(悬挂缩进的效果)。这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容

(三)首行相对父元素百分比缩进

首行相对父元素缩进20%。由于父元素是500px,因此本段落首行就缩进100px。这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容这是段落内容

some text. some text. some text.

this is a paragragh.

(四)文本对齐方式

这是一个居左的段落

这是一个居中的段落

这是一个居右的段落

(五)字间隔:设置字,单词 之间的间隔

This is a normal paragraph. 这是普通段落,这是普通段落。

The spaces between words will be increased. 单词之间的间距被扩大了,单词之间的间距被扩大了。

The spaces between words will be decreased. 单词之间的间距被缩小了,单词之间的间距被缩小了。

注:word-spacing属性对中文无效。

(六)字符间隔:设置字符或字母之间的间隔

This is a normal paragraph. 这是普通段落,这是普通段落。

The spaces between letters will be increased. 字符之间的间距被扩大了,字符之间的间距被扩大了。

The spaces between letters will be decreased. 字符之间的间距被缩小了,字符之间的间距被缩小了。

(七)字符转换:改变字母的大小写

Hello world转为大写:Hello world

Hello world转为大写:Hello world

Hello world转为每个单词首字母大写:Hello world

(八)字符装饰:下划线/贯穿线 等

下划线

上划线

(九)空格处理

(1)normal:这个 段落里面有 很多 的空格 以及很多的换行符,测试 不同的 空格处理方式

(2)pre:这个 段落里面有 很多 的空格 以及很多的换行符,测试 不同的 空格处理方式

(3)pre-wrap:这个 段落里面有 很多 的空格 以及很多的换行符,测试 不同的 空格处理方式

(4)pre-line:这个 段落里面有 很多 的空格 以及很多的换行符,测试 不同的 空格处理方式

(5)nowrap:这个 段落里面有 很多 的空格 以及很多的换行符,测试 不同的 空格处理方式

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值