Question

我承认我是新手，但这很疯狂。我做错了什么？

我将我的html页面简化为单个css类和单个div。它创造了我想要的......屏幕上的一个蓝色条。但是，如果我更改div和类的名称，页面将不再绘制我的div。

我所做的就是将class1的名称从class1更改为class2。

为什么呢？救命！

<!DOCTYPE html>
<html>
<head>
<style>
.column-left{  width: 33%; background-color: red;}
.column-right{  width: 33%; background-color: blue;}
.column-center{   width: 33%; background-color: green;}
</style>
</head>
<body>
<div class="container">
   <div class="column-left">Column left</div>
   <div class="column-right”>Column center</div>
   <div class="column-center”>Column right</div>
</div>
</body>
</html>

这显示一个红色条，文字＆＃34;栏左边＆＃34;。下面是文字＆＃34;列右边＆＃34;。没别的了。

Answer 1

观察此行

<div class="column-right”>Column center</div>
                      // ^ here

”和"不同

使用"而非”

.column-left{  width: 33%; background-color: red;}
.column-right{  width: 33%; background-color: blue;}
.column-center{   width: 33%; background-color: green;}

<div class="container">
   <div class="column-left">Column left</div>
   <div class="column-right">Column center</div>
   <div class="column-center">Column right</div>
</div>

Answer 2

你需要在这里修改引号：

<div class="column-right”>Column center</div>
<div class="column-center”>Column right</div>

如果我更改了css .class和<div>的名称，页面将停止工作

2 个答案: