css自动换行如何设置?url太长会撑开页面

  我们更新文章时如果有引用其他文章一般会带一个原文url,但这个链接如果太长的话会把内容的版块撑开,整个排版乱了。那我们能不能设置css自动换行呢?如下图所示,其实只要两个样式就能搞定

word-wrap:break-word;
word-break:break-all;

  word-wrap用来控制换行   两种取值:   (1)normal    (2)break-word(此值用来强制换行,内容将在边界内换行,中文没有任何问题,英文语句也没问题。但是对于长串的英文,就不起作用。) word-break用来控制断词   三种取值:   (1)normal   (2)break-all(是断开单词。在单词到边界时,下个字母自动到下一行。主要解决了长串英文的问题。)   (3)keep-all(是指Chinese, Japanese, and Korean不断词,一句话一行,可以用来排列古诗哟~)

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏阿炬.NET

FineUIMvc表格数据库分页,使用CYQ.Data组件

1124
来自专栏木头编程 - moTzxx

PHP 自定义图片的生成与保存实例讲解

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u011415782/article/de...

1373
来自专栏数据小魔方

动态图表系列1|数据有效性(index+match函数)

今天开始跟大家分享动态图表的技巧1——数据有效性(index+match函数)! 动态图表之——数据有效性(index+match) 首先利用数据验证制作下拉菜...

3767
来自专栏偏前端工程师的驿站

CSS魔法堂:你真的理解z-index吗?

一、前言                                 假如只是开发简单的弹窗效果,懂得通过z-index来调整元素间的层叠关系就够了。但要将...

1795
来自专栏腾讯NEXT学位

一看就晕的React事件机制

5438
来自专栏我和未来有约会

silverlight项目小结

最近又用silverlight做了一个小的东西,如图: ? 主要就是下边的导航,点击了后上边的大图和文字简介都跟着做相应的变化。 界面设计的思路:整个silve...

3646
来自专栏非典型技术宅

Quartz2D进行渲染1. 渲染模式2. even-odd rule:奇偶填充规则3. nonzero winding number rule:非零绕数规则4. 其他会用到的渲染模式5. 混合模式

903
来自专栏落影的专栏

Metal入门教程(五)视频渲染

Metal入门教程(一)图片绘制 Metal入门教程(二)三维变换 Metal入门教程(三)摄像头采集渲染 Metal入门教程(四)灰度计算

4134
来自专栏macOS 开发学习

Mac开发跬步积累(四):ImageIO解析Gif 图像数据

这里可以看到Gif 是保存了多幅图像的一个图像文件,有了这个基础认识,我们就可以使用代码来解析Gif图像了.

723
来自专栏数据小魔方

Excel单元格内容合并的技巧!!!

今天给大家分享单元格内容合并的技巧! ▽ 之前推送过一篇单元格数据分裂的技巧,很多同学都私信我说很实用,并且希望以后能够多写一些这种可以瞬间提升工作效率的小技巧...

2817

扫码关注云+社区