<div class="col-sm-6 col-md-6 text-center"> <span class="icons c2"><i class="icon-tools"></i></span> <div class="box-area"> <h3>画</h3> <p>Lorem ipsum dolor sitamet, consec tetur adipisicing elit. Dolores quae porro consequatur aliquam, incidunt eius magni provident</p> </div> </div>把p标签中的文字换成图片
时间: 2023-07-09 19:30:25 浏览: 335
要将这个 div 中的 p 标签中的文字替换成图片,可以在 HTML 中将 p 标签的内容改为一个 img 标签,如下所示:
```
<div class="col-sm-6 col-md-6 text-center">
<span class="icons c2"><i class="icon-tools"></i></span>
<div class="box-area">
<h3>画</h3>
<img src="path/to/image.jpg">
</div>
</div>
```
其中,`path/to/image.jpg` 是你要插入的图片的路径。这样就可以将 p 标签中的文字替换成图片了。注意要确保图片的尺寸和样式适合所在的容器。
相关问题
<div class="col-sm-6 col-md-6 text-center"> <span class="icons c4"><i class="icon-trophy"></i></span> <div class="box-area"> <h3>象棋</h3> <img src="images/xq.jpg"> </div> </div> 用css调节图片大小
可以使用 CSS 中的 `width` 和 `height` 属性来调节图片大小。例如,如果你想将图片的宽度设置为 200 像素,高度自适应,可以使用以下 CSS 代码:
```
.box-area img {
width: 200px;
height: auto;
}
```
如果你想将图片的高度设置为 150 像素,宽度自适应,可以使用以下 CSS 代码:
```
.box-area img {
height: 150px;
width: auto;
}
```
你可以根据实际需要来设置图片的大小。
<div class="about interest"> <h2 class="title2">兴趣爱好</h2> <ul> <li><span class="material-icons" style="vertical-align: -6px;"> piano </span> 钢琴 </li> <li><span class="material-icons" style="vertical-align: -6px;"> code </span> 编程 </li> <li><span class="material-icons" style="vertical-align: -6px;"> nightlife </span> 唱歌 </li> <li><span class="material-icons" style="vertical-align: -6px;"> savings </span> 宠物 </li> </ul> </div>加入鼠标事件
好的,您可以在每个li标签中加入onmouseover和onmouseout属性,来实现鼠标移入移出时的效果。例如:
```
<div class="about interest">
<h2 class="title2">兴趣爱好</h2>
<ul>
<li onmouseover="this.style.color='red'" onmouseout="this.style.color='black'">
<span class="material-icons" style="vertical-align: -6px;">piano</span>
钢琴
</li>
<li onmouseover="this.style.color='red'" onmouseout="this.style.color='black'">
<span class="material-icons" style="vertical-align: -6px;">code</span>
编程
</li>
<li onmouseover="this.style.color='red'" onmouseout="this.style.color='black'">
<span class="material-icons" style="vertical-align: -6px;">nightlife</span>
唱歌
</li>
<li onmouseover="this.style.color='red'" onmouseout="this.style.color='black'">
<span class="material-icons" style="vertical-align: -6px;">savings</span>
宠物
</li>
</ul>
</div>
```
在这个例子中,当鼠标移入li标签时,会将字体颜色改为红色,当鼠标移出时,又将字体颜色改回黑色。您可以根据自己的需求来修改鼠标事件的效果。
阅读全文