前端-细节处理笔记

[b]图片处理[/b]

带缩略图的可更新焦点图，不按照固定尺寸上传，那么我们给图片设置

.item .imgWrap{
height : 500px; // 图片最大高度，让img vertical-align;
}

.item .imgWrap img{
width: auto;  // 图片根据高度自动变动宽度;
max-width: 600px;
max-height: 500px;  // 设定最大高度，原图片大于这个高度，就按照比例自动压缩宽度，如果压缩后的宽度大于最大宽度，则又按照最大宽度按比例压缩宽度高度;
vertical-align: middle; //如果图片高度不够最大高度, 图片水平居中父级;
}

[b]排错思路：[/b]

　　* 检查 javascript脚本是否反复引入 (多个相同的js文件会产生无法预料的错误);

* 当你不知道某些函数在哪被调用的时候，不必恼火，把这函数注释掉，这样调用此函数的语句就会立马在console控制台报错，抓到了吧？哈哈..

　　 (但是这个函数调用的次数太多，找到调用的位置就太麻烦了，因为每当语句报错，JS就会停止在这个地方，不再运行;);

　　* 后端输出模版出错，检查标签是否闭合, 或者标签的代码书写失误.

HTML符号:

　　特殊符号如 > < © 这些符号，必须使用   >这些来代替，否则程序渲染可能会出问题;

文本换行:

.hotClick_bd .linksWrap a{
display:inline-block; //关键，让文本有了边界，否则文本就不会知道从哪开始换行，而整段文本变成一排;
white-space:nowrap;
}