                        课程
                    
                        /前端开发
                        
                            /HTML/CSS
                        
                        /初识HTML(5)+CSS(3)-升级版

既然说了width和height是指内容，我就不明白了这里显示的效果width的100px为什么比padding的50px还要短了？

谁能回答我吗？

慕粉4370907

2016-11-25

源自：初识HTML(5)+CSS(3)-升级版 12-12

关注问题我要回答

1229

操作

收起

6 回答

王豆芽回答被采纳 +3 积分
2016-11-25

height和width的问题上面的人已经解释了这个英文不换行是因为英文字母之间如果没有空格那么系统就会认为是一个单词就不会自动换行就像中文里面比如“码”这个字系统认为是一个字就不会为了换行而拆成“石”和“马”来展示所以上面有人说打空格试试就是因为空格可以识别所以一行塞不下就会下一行展示如果想解决这个问题也简单在#box1的属性里面加这个 “word-wrap:break-word;” 也就是分开字符的意思就可以看到英文也自动换行的效果了

0 回复有任何疑惑可以回复我~

收起回答

慕粉4370907 提问者

非常感谢！

2016-11-25 回复有任何疑惑可以回复我~

天生我才必有用哈
2016-11-25

英文里打几个空格，你试试看下效果

0 回复有任何疑惑可以回复我~

收起回答

慕粉4370907 提问者

打空格会换行

2016-11-25 回复有任何疑惑可以回复我~

天生我才必有用哈
2016-11-25

一长串英文被当成一个单词，当然会超出了

0 回复有任何疑惑可以回复我~

收起回答

慕粉4370907 提问者

什么意思

2016-11-25 回复有任何疑惑可以回复我~

用户k88e3vug45
2016-11-25

这个盒子现在的宽度是170=100（width）+50（右padding）+20（左padding）

高度是120=100（height）+10（上padding）+10（下padding）

0 回复有任何疑惑可以回复我~

收起回答

慕粉4370907 提问者

为什么中文不会超出边框，而英文会超出边框，你在盒子1后面加上“基督教司法护短ID我及司法第五回电话市场定位iusdsjfsdhfiuheufihweiuhfewihfuwehfuhweuifhweuihfiuewhfiuheuifh”我积分不够无法提供图了，只要类似像我那样的中英文结合体都可以，你试试

2016-11-25 回复有任何疑惑可以回复我~

白石青

宽度你计算有误吧，padding有三个值的时候，是“上、左右、下”，那么宽度应该=100+50+50+1=201 同理长度=100+10+20+1=131

2016-12-15 回复有任何疑惑可以回复我~