我是 html/CSS 新手,尝试在两个图像之间放置文本。使用下面的代码,我能够做到这一点。但如果我有太多文本,格式就会乱序,如图 1 所示。您能告诉我如何使我的网站看起来像图 2
吗?
<!DOCTYPE html>
<html>
<body>
<div class="header">
<img src="http://www.w3schools.com/browsers/pic_chart.jpg" style="vertical-align: middle"/>
<a href="http://www.w3schools.com" style="font-family:Georgia;color:black;font-size:17px;">The site provides a reference manual covering many aspects of web programming, including technologies such as HTML, XHTML, CSS, XML, JavaScript, PHP, ASP, SQL etc. W3schools presents thousands of code examples. By using the online editor provided, readers can edit the examples and execute the code experimentally.</a>
<img src="http://www.w3schools.com/browsers/pic_chart.jpg" style="vertical-align: middle"/>
</div>
</body>
</html>
图 1:
图2:
最佳答案
您可以 float 所有元素,将文本包装在 div 中,然后为包含文本的 div 指定宽度。您可以使用内联样式执行此操作,也可以在单独的样式表中执行此操作,如示例所示。
添加样式:
img {
float: left;
}
#text {
width: 300px;
float: left;
}
关于html - 两个图像之间的文本?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19697585/