display為inline?
做圓角矩形的時候,遇到下面的問題,先貼代碼:
<!DOCTYPE html> <html> <head> <title>test</title> <meta charset="UTF-8"> <style> .quarter_round { background: white; display: inline-block; width: 14px; height: 14px; overflow: hidden; font-family: 宋體, sans-serif; /*不設置為宋體則FF下異常*/ } .quarter_round span { display: inline-block; font-size: 28px; line-height: 1; } .quarter_round .lb { margin-top: -14px; } </style> <script> </script> </head> <body> <span class="quarter_round"><span class="lb"><愛尬聊_百科詞條>;●</span></span> </body> </html>
所有span標簽都是inline-block,我想通過margin-top讓內層標簽“升”上去,讓左下角的4分之一圓顯示在外層span里,但是我發現margin-top到達某個值的時候就不再上升了,上面的代碼中是-11px,請問為什么會出現這種情況?
