Question

我想在标签之前添加图片。

＆＃13;

<a href="index.html">Apple</a>

＆＃13;

例如，之前添加Apple徽标，但在Apple文本的同一行中。

由于安德鲁

Answer 1

使用image标签插入徽标。正确调整徽标的宽度和高度

试试这个：

<img src="url" width="30", height="30">  <a href="index.html">Apple</a>

在此处，为徽标提供适当的网址。

Answer 2

使用display:flex;与warp div设置同一行中的a和img

您可以将align-items: center;设置为居中文字

了解flex：https://www.w3schools.com/cssref/css3_pr_flex.asp

    .warp{
    display:flex;
    align-items: center;
    }
    img{
    height:150px;
    width:150px;
    }

<div class="warp">
<img src="https://material.angular.io/assets/img/examples/shiba1.jpg"/>

    <a href="index.html">Apple</a>
</div>

Answer 3

如果要动态插入图像，请查看以下示例：检查：

http://grpd.es/apple/apple.html

http://grpd.es/apple/tomato.html

代码示例：

<html>
<BODY>
<a href="index.html">Apple</a>
<a href="peach.html">Peach</a>
<a href="tomato.html">Tomato</a>
<button onclick="insertar()">imagen</button>
<script language="javascript">
function insertar(){
imagen=document.createElement('img');
imagen.src="apple.png";
imagen.id="img1";
document.body.appendChild(imagen);
var el = document.getElementsByTagName("a");
for(i=0;i<el.length;i++){
if(el[i].innerHTML=='Apple'){
var iimagen = document.body.insertBefore(imagen,el[i]);
}
}
}
</script>

</BODY>
</html>

在HTML中的链接前插入徽标

3 个答案: