0

Adobe Dreamweaver - 如何“移动”图像

我正在使用 HTML，并且要移动三张图片，现在看起来像这样：http: //jonathangurebo.tumblr.com/post/41614799078

如何让它变得更好。我希望它看起来像这样：http: //jonathangurebo.tumblr.com/post/41614824708

我是怎么做的？我是 Dreamweaver 的初学者。

我的 HTML 代码如下所示：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Jonathan Gurebo</title>
<style type="text/css">
<!--
body {
    background-color: #191919;
}
-->
</style></head>

<body>
<center>
  <p><img src="Pictures/Jonathan Gurebo.png" width="405" height="76" />
  </p>
  <p><img src="Pictures/Apps.png" width="128" height="86" />f<img     src="Pictures/Contact.png" width="194" height="72" /></p>
  <p>&nbsp;</p>
</center>
</body>
</html>
4

2 回答 2

5

正如 hunzaboy 所提到的，为这些图像添加一个类和浮动可能是实现所需效果的最快方法。

但是，我真正推荐的可能是购买一本书，例如HTML & CSS: Design and Build Web Sites

尤其是那本很棒的书，它将帮助您真正了解 HTML 和 CSS 的基础知识以及在构建网站时使用的良好实践。尽管 Dreamweaver 作为编辑器很不错，但当您只是初学者时，您可能想了解更多关于如何编码而不是使用可视化编辑器的信息。

除了学习如何为自己的利益编写代码外，Dreamweaver 的视觉视图并不总是使用最佳标准 - 例如，它<center>在图像中添加标签并添加宽度和高度，而这应该使用 CSS 来实现 -这是在视觉上设计您的网站的方式。

如果您宁愿在线学习而不是通过书本学习，您也可以尝试Treehouse或在 Tuts+ 上学习 CSS - 两者都是非常棒的、负担得起（或免费）的在线课程，它们应该可以帮助您更好地了解自己是什么'正在尝试做。

希望有帮助！:)

于 2013-01-27T17:06:57.507 回答
0

简单的方法是添加一个类。并左右浮动图像

.classname {浮动：左；显示：块；}

或者另一种简单的方法是创建 3 个 div（如果您想在两个图像之间保留任何文本）并相应地浮动它们。

如果您需要更多说明，请告诉我。

另外，由于您是 html 新手，所以我建议您通过框架开始学习。http://getbootstrap.com是一个很好的框架，可以在坚实的基础上启动您的网站。

于 2013-01-27T16:36:28.710 回答