在浏览网页时,最容易看见一些调整得不是很好的网页.而这些网页又经常浏览.
这时,就需要自定义custom.css时了.
有时,怎么都找不到那个width,可以把所有不相关块都删掉.把有用的层次信息保存为html文件.
然后将css复制下来.在刚才的html文件里链接进来.
1,先不加时,看是不是正常.可能都正常.而且表现很好.
2,然后把css链接进来.一看,是不是马上就有问题了.
然后把可疑的css语法都替换一遍,找是谁在搞破坏.
overflow:
%s/position:/positionn/g
%s/width:/widthtt/g
%s/z-index:/zindex/g
%s/border-collapse:/bordercollapse/g
%s/text-indent:/texent/g
%s/white-space:/ws/g
挨着挨着试,是谁撑大了子元素.
最终这次发现.是可恶的white-space.
好,在菜鸟网里面去看看,这里
重要:white-space:nowrap;规定段落中的文本不进行换行：是不是就撑开子元素了.父元素都没用了.
下面是white-space所有值:
值 |
意义 |
|---|---|
normal |
默认.浏览器忽略空白. |
pre |
浏览器保留空白.行为类似HTML中<pre>标签. |
nowrap |
文本不会换行,文本在同一行上继续,直到遇到 <br>. |
pre-wrap |
保留空白符序列,但是正常换行. |
pre-line |
合并空白符序列,但保留换行符. |
inherit |
从父元素继承white-space 属性值. |
以后当心这个white-space.然后在提取的html的最上层的那个类或标识相关的元素里面找相应white-space元素.然后修改为normal.
为什么这样做.因为这个玩意儿与它上面的元素的宽度无关.而是它下面的元素撑开了.直接找是哪个元素引起的,根本不好找.找不到.
再看一下这个提取的文件.确实,往下找,真不好找是哪个元素在作怪.往上找,必然是父往下找,这么多子,哪个子在搞怪?哪项css在搞怪?总之,就是把不相关的文本去掉.把css下载来引用进去.然后,针对常见的怪css项,批量改,一个个查.总会找出来的.然后针对怪css项,最好从与父项有关的一个个改,定位怪物.使命必达.
这个是一个类搞怪,其余的都跟着怪了.
谷哥翻译,一会儿就给你取消翻译了.折腾.
