溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這期內容當中小編將會給大家?guī)碛嘘P如何解決CSS margin-top在火狐下失效問題，文章內容豐富且以專業(yè)的角度為大家分析和敘述，閱讀完這篇文章希望大家可以有所收獲。
margin-top屬性在火狐及IE下面的表現(xiàn)有的時候是不一樣的，這里和大家分享一下CSS margin-top在火狐下失效的方法，在火狐下margin-top很多時候都會失效，解決這個問題的辦法就是在CSS里面加入：float:left;display:inline;請看下文詳細介紹。
解決CSS margin-top在火狐下失效的方法
margin-top屬性在火狐及IE下面的表現(xiàn)有的時候是不一樣的，在火狐下面可以實現(xiàn)自己定義的效果但是到了IE下面卻成了雙倍的像素，在火狐下margin-top很多時候都會失效，解決這個問題的辦法就是在CSS里面加入：float:left;display:inline;
例子：
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htmlxmlnshtmlxmlns="http://www.w3.org/1999/xhtml"> <head> <metahttp-equivmetahttp-equiv="Content-Type"content="text/html;charset=gb2312"/> <title>無標題文檔</title> <styletypestyletype="text/CSS"> <!-- .w{ background-color:#000099; padding:0px; height:100px; width:200px; margin-top:20px; margin-left:30px; } --> </style> </head> <body> <divstyledivstyle="background-color:#006666;width:400px;height:200px;clear:both;"> <divclassdivclass="w"></div> </div> </body> </html>解決后：
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htmlxmlnshtmlxmlns="http://www.w3.org/1999/xhtml"> <head> <metahttp-equivmetahttp-equiv="Content-Type"content="text/html;charset=gb2312"/> <title>無標題文檔</title> <styletypestyletype="text/CSS"> <!-- .w{ background-color:#000099; padding:0px; height:100px; width:200px; margin-top:20px; margin-left:30px; float:left;display:inline; } --> </style> </head> <body> <divstyledivstyle="background-color:#006666;width:400px;height:200px;clear:both;"> <divclassdivclass="w"></div> </div> </body> </html>上述就是小編為大家分享的如何解決CSS margin-top在火狐下失效問題了，如果剛好有類似的疑惑，不妨參照上述分析進行理解。如果想知道更多相關知識，歡迎關注億速云行業(yè)資訊頻道。
免責聲明：本站發(fā)布的內容（圖片、視頻和文字）以原創(chuàng)、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯(lián)系站長郵箱：is@yisu.com進行舉報，并提供相關證據(jù)，一經查實，將立刻刪除涉嫌侵權內容。
