写网页时常见bug及解决方案:

        1.图片下方有空隙 插入图片后默认会有一个空隙

             给父级元素加一个边框就能看到 :

                   解决方案: img{vertical-align:middle/top/bottom;}

                    img{display:block;}         

                     

           2.插入多个img标签时,换行输入代码,图片左右间有间隙:

                     解决方案:让代码在同一行显示 或者  img{float:left;}

            3.img标签与文本之间或者与input标签上下不对齐:

                      解决方案:img{vertical-align:middle;}

            4.浏览器当中所有的标签都会自带margin和padding,

            且每一个浏览器的margin值和padding值不一样:

                    解决方案:*{margin:0;padding:0;}

            5.行高及高度

             1、浮动引起的副作用(子元素浮动,父元素的高度塌陷)

                   1.给父元素加高度

                    2.给父元素overflow这个元素

                    3.在最后一个子元素的后面添加一个空白div,给该div设置clear:both

                      4.使用万能清除浮动的方法

                      .clearfixed:after{

                        content:"."

                        clear:both;

                        display:block;

                        visibility:hidden;

                        height:0;

                        }

                        5.高度自适应

             6.默认解析的最小高度是16px:

                    解决方法:给元素添加font-size:0;或者给元素添加over-flow:hidden;

             7.表单控件(多个)不一致,单type类型设置为button的时候,高度和其他文本高度不一致:                            

                     解决方法:1.审查元素,直接对有问题的表单修改。

                                        2.给有问题的表单控件添加盒子,给这个盒子设置样式。

               8.百分比问题:在低版本浏览器中(50%+50%>100%):

                        解决方法:清楚浮动元素的空间(clean:both)/(clean:right).

                9.网页中按钮元素大小不一致;

                         解决方法 :1.如果按钮不在表单里面,都是用a模拟;

                                            2.如果按钮是一张图片,直接切图做背景即可;

                                            3.input按钮边框显示问题,在input按钮的外围嵌套一个父元素,

                                             边框加在父元素上面即可; 

                  10.透明opacity在低版本浏览器中不解析:       

                             解决方法:1.opacity:1;

                                             2.filter:alpha(opacity=100);

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。