Question

我已经搜索了我的问题的答案，但没有找到答案;或许我做了但只是为了“绿色”才能知道它。我试过webdesign.about.com/positionins，所以你想要定位，呵呵（HTML Goodies）我想把图像放在我文本的左边。我需要图像的div吗？提前谢谢。

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title>Image Practice</title>

    <link href="css/final-practice.css" rel="stylesheet" type="text/css" />
</head>
    <h1> This is an image example.</h1>
    <body>

        <p class="description">This is an example of an image stuck in the middle of HTML paragraph tags of type. <span>&#40See ppt-images-color.pdf in folder Downloads>lecture-01.&#41</span> Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software</p>
        <p img class="wrap-right" src="images/blank-square.png" alt="Example of an image in middle of text" /p>
</body>
</html>

CSS代码：

html {
    margin: 0;
    padding: 0;
    }

body { 
    font-size: 76%; 
    background-color: #ffc;
}

h1 {
  font-weight: bold;
  font-size: 32px;
  color: #000;

}
p {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.2em;
    clear:both;
}

span{
    font-size:12px;
    font-weight:bold;
    color:#780000;
    }

p.wrap-right {
              position:relative;    
              float:left;
              width:32px;
              height:32px;
}

Answer 1

首先，你在这里有无效的Html：

<p img class="wrap-right" src="images/blank-square.png" alt="Example of an image in middle of text" /p>

必须是：

<p> 
<img class="wrap-right" src="images/blank-square.png" alt="Example of an image in middle of text"/>
</p>

要使p内的图片向左移动，请尝试使用CSS：

p {
 text-align:left;
}

Answer 2

您的图片代码在您的代码段中无效。

你有：<p img

应为<p><img

如何定位到文本的左侧

2 个答案: