我如何在没有 id 或类属性 HTML CSS 的部分的左上角/右上角设置 2 张图片

Question

//我被要求创建一个不使用ids或类的网站。他们想在部分的顶部放两张图片。例如，我在 html 代码部分中使用了两个示例。它们会很小并且紧贴标题 - 特别是当我在 css 中使用 img 垂直对齐 -20 和部分 h1 边距顶部 -130 时。

img {
    width: 200px;
    vertical-align: -20px;
}
section {
    background-color: rgba(255, 255, 255, .9);
    width: 1050px;
    height: 1400px;
    margin-top: -1190px;
    margin-left: 110px;
    margin-bottom: 140px;
    border: 2px solid red;
    border-radius: 10px;
    box-shadow: 3px 3px 2px 2px black;
}
section h1 {
    text-align: center;
    font-size: 28px;
    letter-spacing: 10px;
    text-shadow: 1px 1px 1px red;
    margin-top: -130px
}
<section>
    <img src="canada.png" alt="Canada" />
    <img src="canada.giff" alt="Canada" />
    <h1>Title</h1>
</section>

Answer 1

只需在

html 代码中编写 align="right/left" 就很容易了，如下所示：

<img align="left" src="canada.png" alt="canada" />

Answer 2

您可以在src上制作贡品选择器，如下所示：

img[src="canada.png"] { 
   /* Styles for canada.png */
} 
img[src="canada.gif"] { 
   /* Styles for canada.gif */
}