html - 通过访问 html 树更改图像边框

Question

<ul class="xoxo blogroll">
    <li>
        <a href="" target="_blank"><img src="x.png" alt="image"></a>
    </li>
    <li>
        <a href="" target="_blank"><img src="x2.png" alt="image2"></a>
    </li>
    <li>
        <a href="" target="_blank"><img src="x3.png" alt="image3"></a>
    </li>
</ul>

现在我想从中删除边框。

我尝试：

ul.xoxo.blogroll li img {
    border: none;
}

但不工作。语法正确吗？

Answer 1

页面上没有带有 的元素class="xoxblogroll"。如果您希望两个类都存在，您可以使用以下内容：

ul.blogroll.xoxo li img {
    border: none;
}

Answer 2

你class="xoxo blogroll"的空间意味着浏览器将 ul 解释为具有 2 个类，“xoxo”和“blogroll”

从类定义中删除空格，如下所示：class="xoxoblogroll"，或仅选择 CSS 中的 2 个单词之一，如下所示：

ul.xoxo li img {
    border: none;
}

或者

ul.blogroll li img {
    border: none;
}

或者如果两个类名都必须存在，则按如下方式连接 CSS 中的 2 个类：

ul.xoxo.blogroll li img {
    border: none;
}

Answer 3

一些选择器是：

ul.blogroll li img {
    border: none;
}

或者 ：

ul.xoxo li img {
    border: none;
}

或者 ：

li img {
    border: none;
}

或者 ：

ul li img {
    border: none;
}

Answer 4

嗨，现在写这个 CSS

.xoxo.blogroll li img{
border:0;
}

或者现在你应该删除 text decoration none

像这样

.xoxo.blogroll li a{
text-decoration:none;
outline:0;
}

Answer 5

试试这个。像这样给出正确的图像识别方法

ul.xoxo.blogroll li a img {
border: none;
}

或者

ul.xoxo.blogroll li a img {
border: 0px;
}

Answer 6

我认为您的类选择器不正确，您确定可以像这样将两个类名推到一起吗？尝试：

ul.xoxo li img {
    border: none;
}

或者

ul.blogroll li img {
    border: none;
}