img不在CSS HTML中显示

Question

I'm trying to place an img in a section class (.col) of a column in my layout and the image doesn't show up. 我正在尝试在布局中的列的节类（.col）中放置img，但图像不显示。 The background color doesn't show up in .col either. 背景颜色也不会显示在.col中。 I am learning CSS and working on my 1st project to layout a webpage. 我正在学习CSS，并正在我的第一个项目中设计一个网页。 I'm using Aptana and Firefox. 我正在使用Aptana和Firefox。 Thank you. 谢谢。

<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>fixed layout</title>
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link href='https://fonts.googleapis.com/css?family=Open+Sans: 300,600,700&subset=latin,greek' rel='stylesheet' type='text/css'>
<style>
aside, article, section, header, footer, nav {
    display: block;
}
div, section, article, h1, h2, h3, p {
    margin: 0;
    padding: 0;
}
html, body {
    margin: 0;
    padding: 0;
}
html {
    background: rgb(206, 193, 167);
}
body {
    background: #fff;
    font: 100% 'Open Sans', Arial, Helvetica, sans-serif;
    width: 960px;

    margin: 0 auto 2em;
}
/*layout*/
header {
    background:rgb(0,114,143);
    margin-bottom: 16px;
    height: 48px;
    padding: 36px 0 0 36px;
}

.col1 {
    float: left;
    padding-left: 48px;
    width: 112px;
    background:rgb(126,208,224);

}
.col2 {
    float: left;
    padding-right: 48px;
    padding-left: 48px;
    width: 464px;
}
.col3 {
    float: left;
    padding-right: 48px;
    width: 112px;
    font-size: 140%;
    line-height: 1.6;
}
footer {
    height: 80px;
    clear: both;
    background-color: rgb(100,98,102);
}
img {
    float: left;
    margin: 0 1em 0 0;

}
/*typography*/

p {
    font-weight: 300;
    font-size: 1em;
    line-height: 1.5;
    margin-bottom: 1em;
}

</style>
</head>
<body>
<header>

</header>
<section class="col1">
    <img src="/_images/ny_08.2.jpg" width="112" height="112" alt="NY City">
</section>
<section class="col2">
<p>My father was a St. Bernard, my mother was a collie, but I am a Presbyterian.<p>
<p>My mother had a fondness for such; she liked to say them, and see other dogs look surprised and envious, as wondering how she got so much education.</p>
<p>If there was a stranger he was nearly sure to be suspicious, and when he got his breath again he would ask her what it meant. And she always told him.</p>
<p>The others were always waiting for this, and glad of it and proud of her, for they knew what was going to happen, because they had had experience. </p>
<p>With a view to action experience seems in no respect inferior to art, and men of experience succeed even better than those who have theory without experience.</p>
</section>
<aside class="col3">
<p>But no harm was done; the others rolled and barked too, privately ashamed of themselves for not seeing the point </p>
</aside>
<footer></footer>
</body>
</html>

在此处输入图片说明

Answer 1

Where is the image on the hard drive relative to the root of your web server? 硬盘驱动器上的映像相对于Web服务器的根目录在哪里？ It's likely that the file isn't found because the _images folder is at the root, but the url you have to load it is a relative url. 可能由于_images文件夹位于根目录而找不到该文件，但是您必须加载的URL是一个相对URL。 If that's the case, changing the url to be absolute would fix it. 如果是这种情况，将网址更改为绝对网址即可解决该问题。

<img src="/_images/ny_08.2.jpg" width="112" height="112" alt="NY City">

The beginning forward slash is the change. 开头的正斜杠就是更改。

Relative urls start from the current folder, so the existing url is actually looking for http://127.0.0.1:8020/grid_website.htm/_images/ny_08.2.jpg and what the change I show has done is make it look at http://127.0.0.1:8020/_images/ny_08.2.jpg . 相对网址是从当前文件夹开始的，因此现有网址实际上是在寻找http://127.0.0.1:8020/grid_website.htm/_images/ny_08.2.jpg ，我显示的更改是让它查看http://127.0.0.1:8020/_images/ny_08.2.jpg 。

img不在CSS HTML中显示

问题描述

1 个解决方案

解决方案1
0 2016-07-12 23:56:28

img不在CSS HTML中显示

问题描述

1 个解决方案

解决方案1 0 2016-07-12 23:56:28

解决方案1
0 2016-07-12 23:56:28