博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
css疑难汇总
阅读量:6690 次
发布时间:2019-06-25

本文共 697 字,大约阅读时间需要 2 分钟。

关于a标签不换行顶开容器的问题():

我们用div,p,ul,li(等块级元素)布局给其设定了特定的width,那么就会自动的换行。span,a(等内联元素)设置了display:inline-block,或者display:block;也可以自动换行了。(但是含英文的时候这种方法就无效了,还是会超出来)

我们一般控制换行所用到的CSS属性一共三个:word-wrap;word-break;white-space;

word-wrap语法:各浏览器均能识别   word-wrap:normal(默认)|break-word;

网上的结论

word-wrap:normal(默认)|break-word;

参数:

  normal:允许内容顶开指定的容器边界。

  break-word:内容将在边界内换行,必要时触发word-break(注意请分辨清楚word-break和break-word两个是不同的东西,一个为属性,一个为参数);

说明:

  word-wrap是控制是否”为词断行”的,设置或检索当前行超过指定容器时是否断开转行。中文没有任何问题,语句也没有问题,但是对于长串的英文,就不起作用。

范例:

congratulation这个单词属于长串英文,word-wrap:break-word整个单词看成一个整体,如果该行末端宽度不够显示整个单词,它会自动把整个单词放到下一行,而不会把单词截断,这就是对于长串文字不起作用的解释。word-wrap:normal是默认情况,英文单词不被拆开。

 

转载于:https://www.cnblogs.com/xiii/p/5090546.html

你可能感兴趣的文章
第一次作业
查看>>
PHP算法:等宽等像素值截取字符串
查看>>
Lync Server与Outlook Web App集成
查看>>
visudo精确用户赋权与sudo日志跟踪
查看>>
LVM系列4
查看>>
MYSQL 基础记录(1)
查看>>
windows查看进程路径
查看>>
Data persistence overview
查看>>
The final mile: Upgrade to Grails 2.4.3 and use Sp
查看>>
springBoot(7):web开发-错误处理
查看>>
linux中top命令详解
查看>>
MODIS批量处理软件MRT的安装说明
查看>>
MySQL数据库索引
查看>>
keyCode 大全
查看>>
一个经典编程面试题的“隐退”
查看>>
【java基础知识】使用javap对代码进行反汇编
查看>>
iOS中AFNetworking的简单使用
查看>>
Spring学习总结——Spring实现AOP的多种方式
查看>>
hibernate笔记: 关于懒加载和load()方法
查看>>
mysql高级一点的查询用法
查看>>