Question

我有一个外部css用于重置，适用于所有表，td，div等。在我的网站中，有一个客户模板，允许用户以html格式创建他们想要的内容。

在网页中查看此客户模板时，我不想申请上述外部css 所以我将这个客户模板内容放入div中，并试图从css中排除这个div及其所有孩子。

是否可以编写css选择器来选择所有表，td，div等...这些不是给定div id的子代？

下面是我的测试html代码和reset.css div customtemplate的内容由用户动态输入。用户尝试border = 1到表，它将所有表格单元格应用于没有reset.css的边框1。但是使用重置css，没有边框出现。我的用户不是html / css professional，所以他们会创建简单的html，并期望在他们的测试页面中显示。如果他们的html对于所有浏览器看起来并不完全相同，则取决于他们我不负责任。我只需要在没有reset.css的div中显示他们的html。无论如何要解决？

            <html>
            <head>
                <link href="reset.css" type="text/css" rel="stylesheet"/>
            </head>
            <body>
                <div class="customtemplate">
                    <table border="1" cellpadding="10px">
                        <tr>
                            <td>abcd</td><td>def</td>
                        </tr>
                        <tr>
                            <td>hello</td><td>world</td>
                        </tr>
                    </table>
                </div>
                <br><br>
                <table>
                    <tr>
                        <td>default</td><td>reset</td>
                    </tr>
                    <tr>
                        <td>style</td><td>using</td>
                    </tr>
                </table>
            </body>
            </html>


            table, td {
                border: 0;
                padding: 0;
            }

Answer 1

正确的方法是为该div定义您的默认值。重置CSS可帮助您避免由浏览器中的不同默认值引起的问题。因此，对于具有给定ID的div，您应该定义一些合理的默认值，这些默认值与站点上使用的默认值不同，但仍然可以在每个浏览器上保持相同的默认值。

例如：

/* reset.css */

p { margin: 0; }

/* yourdefaults.css */

#yourdiv p { margin-bottom: 10px; }

CSS选择器异常

1 个答案: