外部CSS：如何从外部CSS实现一个类？

Question

我无法弄清楚如何从我的外部css中使用这个类：

.row.rectanglebox {
    margin-top:30px;
    margin-bottom:30px;
    height: 210px;
    border: solid black;
    padding: 20px;
}

我尝试添加以下内容（我通常会使用），但无济于事：

<div class="rectanglebox">
       <p> sample text </p>
<div>

我想要实现的是以下图片：

Answer 1

这里的问题是在CSS文件中，.row.rectangle表示包含.row类，然后是.rectanglebox类的任何元素，或者包含.rectanglebox类的任何元素具有class="row rectangleclass"类的子元素的行类将应用这些样式。

您可以将代码更改为.rectangleclass { ... }，也可以将CSS更改为{{1}}

Answer 2

您忘记了div中的.row课程，请执行此操作：

HTML：

<div class="row rectanglebox">
    <p> sample text </p>
<div>

当你看到这个时：.row.rectanglebox这意味着该元素有两个类，但你的div只有.rectanglebox类。

问候！

Answer 3

它可以在这里工作

＆＃13;

＆＃13;

.row.rectanglebox {
  margin-top: 30px;
  margin-bottom: 30px;
  height: 210px;
  border: solid black;
  padding: 20px;
}

＆＃13;

<div class="row rectanglebox">
  <p> sample text </p>
  <div>

＆＃13;

＆＃13;

＆＃13;