如何將文本添加到html中的邊框線

目前我正在學習html和css，這個問題可能不清楚！如何將文本添加到html中的邊框線

問題是我想添加文字（廣告）在兒童邊界線的頂部，但它不符合要求看代碼行下面的圖片，請指導我可能是無意義的保證金屬性爲你在CSS代碼。

#parentBox { 
 
    border: 2px solid red; 
 
    height: 180px; 
 
    width: auto; 
 
} 
 

 
#childBox { 
 
    background: #f2f2f2; 
 
    height: 70%; 
 
    border: 2px solid #f2f2f2; 
 
    margin: 20px 70px 20px 340px; 
 
}

<div id="parentBox"> 
 
    <div id="childBox">advertisement</div> 
 
</div>`

來源

2017-08-02 Khalil

Margin屬性是用來給從父元素從它裏面的文本元素餘地，不。如果你想這樣做，你必須使用填充，但你不能將文本移動到div的邊界之上，那麼你正在div中寫入文本。爲此，您應該在div上方寫入文本，而不是在div內。 –

這裏一個快速的答案，你需要顯示但也有其他什麼辦法做到這一點:)

#parentBox { 
 
    border: 2px solid red; 
 
    height: 180px; 
 
    width: auto; 
 
} 
 

 
#childBox { 
 
    background: #f2f2f2; 
 
    height: 70%; 
 
    border: 2px solid #f2f2f2; 
 
    margin: 0 70px 20px 340px; 
 
} 
 

 
#title{ 
 
    margin: 20px 70px 0px 340px; 
 
}

<div id="parentBox"> 
 
    <span id="title">advertisement</span> 
 
    <div id="childBox"></div> 
 
</div>`

來源

2017-08-02 10:11:10

儘量使字體大小和行高相同的值。如果它仍然沒有碰到邊緣，可以嘗試減小線條高度。但是，如果這對於多行的段落內容來說，內容將會擁塞並且會影響可讀性。

來源

2017-08-02 10:08:32

所以，我想您的問題，這裏是解決方案。只需添加 [span style =「position：absolute; margin-top：-18px;」]廣告[/ span] 我希望這可以解決您的問題！

來源

2017-08-02 10:34:10

下面是解決方案。

CSS：

<style> 
#parentBox { 
    border: 2px solid red; 
    height: 180px; 
    width: auto; 
} 

#childBox { 
background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 13%, rgba(242,242,242,1) 14%, rgba(242,242,242,1) 100%); /* FF3.6-15 */ 
background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 13%,rgba(242,242,242,1) 14%,rgba(242,242,242,1) 100%); /* Chrome10-25,Safari5.1-6 */ 
background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 13%,rgba(242,242,242,1) 14%,rgba(242,242,242,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ 
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#f2f2f2',GradientType=0); /* IE6-9 */ 
    height: 70%; 
    margin: 20px 70px 20px 340px; 
} 
</style>

HTML：

<div id="parentBox"> 
    <div id="childBox">advertisement</div> 
</div>

來源

2017-08-02 11:03:49

如何將文本添加到html中的邊框線

回答

相關問題