代碼如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>無標題文檔</title><style type="text/css">body {margin:0px;padding:0px;font-family:verdana, arial, sans-serif;}.blockelement{width:700px;height:120px;border:20px solid yellow;background-color:#3F6;}.inlineelement{border:10px solid red;background-color:gold;text-align:center;font-size:24px;}</style></head><body><div class="blockelement"><span class="inlineelement">內嵌元素</span></div></body></html>
不理解為什麼內嵌元素的上邊框會“滲入”外圍的邊框，而左邊框卻不會。（塊元素邊框20px，而內嵌元素10px）我特地把邊框加粗，這種效果更明顯。
顯示效果如所示：
要解決這個問題，在塊元素中採用相對定位（加入position:relative;），內嵌元素採用絕對元素（position:absolute; top:0px; left:0px;）。代碼如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>無標題文檔</title><style type="text/css">body {margin:0px;padding:0px;font-family:verdana, arial, sans-serif;}.blockelement{width:700px;height:120px;border:20px solid yellow;background-color:#3F6;position:relative;}.inlineelement{position:absolute;top:0px;left:0px;border:10px solid red;background-color:gold;text-align:center;font-size:24px;}</style></head><body><div class="blockelement"><span class="inlineelement">內嵌元素</span></div></body></html>
效果如下：
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
