CSS(4)css样式中的text样式

介绍:本节介绍text样式和一起其他的样式,css的样式更新就完了,因为css单词较多,所以希望大家能够好好背单词,这样写的时候才不会一直去翻笔记这样效率就会大大增加。最后,希望大家能够学会css。

一. text样式总结

        单词很多,希望大家都能好好背

text-align:center;文本居中
text-align:right;文本居右
text-align:left;文本居左
text-align:justify文本两端对齐
text-indent:2px;缩进;首行缩进
text-indent:-2px负缩进;首行悬挂
text-decoration:underline下划线
text-decoration:line-throng删除线
text-decoration:overline上划线
text-decoration:none无效果
text-transform:capitalize单词首字母大写
text-transform:uppercase字母全部大写
text-transform:lowercase字母全部小写

二、其他样式

        

letter-spacing字符之间的距离
world-spacing单词之间的距离

三、文本溢出样式

        这个看起来很简单的一个样式,但应用还是很广泛的,希望大家能多多理解这一部分

white-space:nowrap空白部分不换行
overflow:scroll出现滚轮条
overflow:hidden溢出部分隐藏
overflow:visible默认,消除效果
text-overflow:ellipsis文本溢出部分显示省略标记

 实例:

        这里给大家写下代码,可能理解起来不清楚,有需要的也可以私信我。

<style>
    div{
    width:200px;
    white-space:nowrap;
    overflow:scroll;
    overflow:hidden;
    text-oveflow:ellipsis;
}
</style>

<div>
    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quisquam dolorem earum iure in quae mollitia minima rerum eligendi iste magni pariatur eum ipsam maiores reprehenderit excepturi nam optio nemo vitae.
			Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maiores temporibus esse incidunt eligendi debitis soluta possimus et itaque iste minus repudiandae ut deleniti velit nulla suscipit quisquam nisi dignissimos cum.
</div>

运行截图;

 

  • 5
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

棋宣

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值