將圖像附加到第一個字母

Question

我有一個問題 如何使用CSS將圖像附加到H1的第一個字母？ 查看圖片 有什麼想法？

Answer 1

您可以嘗試使用:before僞類來附加圖像。

例子：http://jsfiddle.net/8o0z6a8r/1/

<sytle> 
h1:before { 
    content: url(http://placehold.it/50x50); 
    width: 50px; 
    height: 50px; 
    position: relative; 
    top: 50px; 
    left: 20px; 
} 
</style> 

<h1>LINKBOUND's</h1> 

Answer 2

你可以做這樣的事情：jsFiddle

<div id="container"> 
    <h1 class="maintitle">LINKBOUND</h1> 
</div> 

CSS：

#id{ 
    position:relative; 
} 

.maintitle{ 
    font-size:100pt; 
} 

.maintitle:before{ 
    content: url('http://placehold.it/75/75'); 
    position:absolute; 
    top:170px; 
}