Blogger的文本框

我希望我的博客文本框可以發佈Html - CSS代碼，用戶可以複製它們。示例= http://3.bp.blogspot.com/-OhvKmLgY-O4/UnaA9HGfcVI/AAAAAAAAA3Y/b4VrxT8BK8U/s1600/Long+code.png Blogger的文本框

我的圖片鏈接= http://1.bp.blogspot.com/-i3AX6FFu9N8/UnYbGgMgYhI/AAAAAAAAA2k/SFv0kK7x6YI/s1600/Coding+Place+For+Blogger.png

我想，如果代碼是很小的。它應該會自動變成這個樣子= http://1.bp.blogspot.com/-RYmQ9CRKiVw/UnaAv0niNuI/AAAAAAAAA3Q/2Fi6bRvkUUg/s1600/small+code.png

和如果代碼很長，它會自動是這樣= http://3.bp.blogspot.com/-OhvKmLgY-O4/UnaA9HGfcVI/AAAAAAAAA3Y/b4VrxT8BK8U/s1600/Long+code.png

當我試着讓它和我貼在它的代碼，它變得太可怕了，你可以看到= http://1.bp.blogspot.com/-CP8_CBwHwMk/UnZ33pJdhEI/AAAAAAAAA2w/8e8mZUsAwRo/s1600/solution+please.png

CSS代碼：

#tbox1 { 
    background:url(http://1.bp.blogspot.com/-i3AX6FFu9N8/UnYbGgMgYhI/AAAAAAAAA2k/SFv0kK7x6YI/s1600/Coding+Place+For+Blogger.png) no-repeat; 
    width:500px; 
    height:380px; 
    margin:10px; 
    padding:20px 40px; 
    overflow:auto; 
    word-wrap:nowrap; 
    /*font styles*/ 
    font-family:'Open Sans', sans-serif; 
    font-size:16px; 
    /*1em*/ 
    color:#000000; 
    line-height:20px; 
}

HTML代碼

<div id="tbox1">Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code Testing The Code v</div>

你可以的jsfiddle看到什麼實際發生在我身上

http://jsfiddle.net/e5nHr/

來源

2013-11-03 Master M1nd

css中的圖片網址是否正確？對我來說它說404. – havana

[Works罰款]（http://jsfiddle.net/H7569/）。雖然我確實在背景屬性中添加了「no-repeat」。 –

@havana是的那個時候，圖片url不正確。但我糾正它，檢查我的新問題：| 。我已經在這裏發佈了答案 –

在你的CSS添加以下代碼：

background-repeat: no-repeat;

我也注意到你提供這種形象對留下一些設計因此您需要提供一些填充物

padding-left: 60px; 
padding-top: 10px;

來源

2013-11-03 10:03:52

http://jsfiddle.net/H7569/

#tbox1 { 
    background:url(http://1.bp.blogspot.com/-i3AX6FFu9N8/UnYbGgMgYhI/AAAAAAAAA2k/SFv0kK7x6YI/s1600/Coding+Place+For+Blogger.png) no-repeat center center; 
    width:500px; 
    height:333px; 
    margin:10px; 
    /*font styles*/ 
    font-family:'Open Sans', sans-serif; 
    font-size:16px; 
    /*1em*/ 
    color:#000000; 
    line-height:20px; 
} 
.content { 
    width: 410px; 
    height: 290px; 
    overflow: auto; 
    position: relative; 
    top: 20px; 
    left: 60px; 
    bottom: 20px; 
    right: 20px; 
}

來源

2013-11-03 16:37:41

Blogger的文本框

回答

相關問題