HTML:如何使用 CSS 作为链接样式表添加图像

标签 html css

这是我的代码。我正在尝试将名为 lg.png 的图像添加到 HTML 中,并能够在 css 文件中编辑长度/宽度。 lg.png 与 index.html 和 styles.css 位于同一文件夹中

尝试在网上寻找这个答案,但似乎找不到任何运气。

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd ">

<head>
    <title>yournetid</title>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <link rel="stylesheet" type="text/css" href="style.css"/>   
</head>
<img id="my_image" src="lg.png" alt="image error"/>

        &nbsp;
<body>
    <p>
        Here's some awesome pictures!
    </p>
</body>

CSS:

body {

img#lg 背景:url(lg.png); 宽度:200px; 高度:100px;

最佳答案

您正在尝试使用 CSS 选择器 img#lg这是没有意义的。您告诉 CSS 查找 ID 为“lg”的图像,但您没有为图像设置任何 ID。

此外,设置 background-image:ur(lg.png)<img src='lg.png'> 不同.

修复它:

  1. 为您的图片添加 id
  2. 在您的 CSS 中定位 id。

更改您的 HTML:

 <img id="my_image" src="lg.png" alt="image error">

CSS:

#my_image {width:200px; height:100px; }

如果您想更改所有图像的 CSS 属性,您可以使用以下内容:

img {width:200px; height:100px; }

希望这对您有所帮助!

关于HTML:如何使用 CSS 作为链接样式表添加图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21412536/

相关文章:

html - CSS 断字 : break-all doesn't break URLs?

css 背景图像不是无缝的

css - 你能在 CSS 中使用 if/else 条件吗?

html - flex 方向 : column; not working in IE and Edge

javascript - 使用 ng-repeat 从集合中提取一些信息

javascript - 固定位置和 %width + 不与页脚重叠

javascript - mac "VoiceOver"访问模态框下方的内容

javascript - 表格: "Select all" button with multiple-choice checkboxes

html - 为什么边距顶部不起作用?

javascript - 自定义谷歌地图不工作