CSS3如何实现自动换行效果

PHP中文网 JavaScript 百度已收录

当前第2页 返回上一页

work-wrap属性

允许长单词或 URL 地址换行到下一行

它有两个属性值，分别为

normal：只能允许在断字点处进行换行是浏览器的默认行为

break-word：可以允许在长单词或者URL地址的内部进行换行

例：

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

<style>

.p1{width:200px;

border:1px solid #ccc;

word-wrap:normal;

}

.p2{

width:200px;

border:1px solid #ccc;

word-wrap:break-word;

}

</style>

</head>

<body>

<p class="p1">PhpChinesewebsiteprovidesalargenumber of free, original, high-definition php video tutorials.</p>

<p class="p2">PhpChinesewebsiteprovidesalargenumber of free, original, high-definition php video tutorials.</p>

</body>

效果图如下：

其实work-wrap与work-break的用法都差不多，实现的功能也基本一样，只不过work-wrap针对的是长单词过着url地址。

总结：以上就是本篇文章的全部内容了，希望通过这篇文章能够让大家对于CSS3中的自动换行有一定的了解

以上就是CSS3如何实现自动换行效果的详细内容，更多文章请关注木庄网络博客！

返回前面的内容

相关阅读 >>

css3如何实现自动换行效果

更多相关阅读请进入《word-break、word-wrap》频道 >>




标签：

打赏

取消

感谢您的支持，我会继续努力的!

扫码支持
扫码打赏，您说多少就多少

打开支付宝扫一扫，即可进行扫码打赏哦

分享从这里开始，精彩与您同在

相关推荐

评论

管理员已关闭评论功能...