前军教程网

中小站长与DIV+CSS网页布局开发技术人员的首选CSS学习平台

CSS 文本(四)——每天几个样式,轻松玩转CSS

小编感觉开始CSS课程之后童靴们就没有之前学HTML那么热情了,想入行前端的童靴们一定要好好学CSS,不要放弃!小编认为CSS的魅力不比JS差。打好CSS基础,在以后学习JS和CSS3之后,我们就可以做很酷炫的动画效果的!

关注小白前端,持续收到文章推送!

1.color 设置文本颜色

p{color:#f00;}

2.line-height 行高

给文本设置行高

在浏览器中显示:

3.letter-spacing 设置字母间距

在浏览器中显示:

4.text-align 设置文本对齐方式

text-align常用属性值:

left 左对齐

right 右对齐

center 中心对齐

justify 两端对齐

在浏览器中显示:

5.text-decoration 向文本添加修饰

text-decoration常用的属性值:

none 默认。定义标准的文本。

underline 定义文本下的一条线。

overline 定义文本上的一条线。

line-through 定义穿过文本下的一条线。

在浏览器中显示:

6.text-indent 首行缩进

在浏览器中显示:

7. text-transform 字母大小写转换

text-transform常用的属性值:

none 默认。

uppercase 大写字母转换。

lowercase 小写字母转换。

在浏览器中显示:

8.white-space 常用的功能是设置文本是否换行显示

whiite-space常用属性值:

nowrap 文本不换行。

pre-wrap 文本换行。

我们做一个例子:

我们给一段文本放在盒子里面,

正常的情况是文本在固定宽度的盒子里会自动换行:

正常换行的文本

我们给元素设置不换行:

在浏览器中显示:

9.word-spacing 设置字间距

在浏览器中显示:

今天就是这么多内容了,童靴们好好练习一下哦~

你必须非常努力,才能看起来毫不费力!

关注小白前端,持续收到文章推送!

发表评论:

控制面板
您好,欢迎到访网站!
  查看权限
网站分类
最新留言