CSS3怎么实现换行

发布时间:2022-03-09 15:39:49 作者:iii
来源:亿速云 阅读:141

本篇内容介绍了“CSS3怎么实现换行”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!

    CSS3TextOverflow属性

    CSS3文本溢出属性指定应向用户如何显示溢出内容

    实例

p.test1 {

    white-space: nowrap; 

    width: 200px; 

    border: 1px solid #000000;

    overflow: hidden;

    text-overflow: clip; 

}

p.test2 {

    white-space: nowrap; 

    width: 200px; 

    border: 1px solid #000000;

    overflow: hidden;

    text-overflow: ellipsis; 

}

    CSS3的换行

    如果某个单词太长,不适合在一个区域内,它扩展到外面:

    CSS3中,自动换行属性允许您强制文本换行-即使这意味着分裂它中间的一个字:

    CSS代码如下:

    实例

    允许长文本换行:

p {word-wrap:break-word;}

    CSS3单词拆分换行

    CSS3单词拆分换行属性指定换行规则:

    CSS代码如下:

    实例

p.test1 {

    word-break: keep-all;

}

p.test2 {

    word-break: break-all;

}

“CSS3怎么实现换行”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识可以关注亿速云网站,小编将为大家输出更多高质量的实用文章!

推荐阅读:
  1. html文本换行如何实现
  2. CSS3实现自动换行效果的方法

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

css3

上一篇:CSS3怎么实现线性渐变

下一篇:css3怎么实现重复的线性渐变

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》