盒子没有'；t工作（html/css）

有人能说出我的代码出了什么问题吗？因此，我试图添加一个蓝色虚线的“块”，但不知为什么它没有显示出来（看起来字体变了，但框仍然没有显示）。我以前也有过类似的问题，但我不知道这次出了什么问题。我是在什么地方漏了一个分号还是写错了什么

当我在JSFIDLE中启动代码时，它似乎工作得很好，但是当我用.html文件打开相同的代码时，一切似乎仍然不工作（图：）。我知道为什么（css文件在正确的位置）

#信息{
颜色：蓝色；
背景：银；
}
.欢迎{
颜色：紫色；
字体大小：20px；
背景色：浅绿色；
文字阴影：1px 1px银色；
}
#标签{
背景颜色：蓝色；
}
代码{
字体系列：“漫画无MS”，草书，无衬线；
显示：内联块；
高度：20px；
宽度：自动；
填充：2px；
保证金：4倍；
背景色：#7FECFF；
文本对齐：居中；
}
.盒子{
边框：1px虚线#540CE8；
}

关于第页

---

只需添加宽度：160px；响应性使用宽度：40%或屏幕上的任意值

.box {
    width: 160px;
border: 1px dashed #540CE8;
}

---

这里是链接

问题是由

引起的

它强制换行，但高度限制可见的内容

移除断开标记。如果你想要间距，使用边距或填充…这就是它们的用途

code{
字体系列：“漫画无MS”，草书，无衬线；
显示：内联块高度：20px；
填充：2px；
保证金：4倍；
背景色：#7FECFF；
文本对齐：居中；
}
.盒子{
边框：1px虚线#540CE8；
}

联系人：

联系人：

---

带边框的框在这里显示得很好，但是，由于它试图放入仅40px宽的“代码”中，所有东西似乎都坏了

如果删除宽度，则渲染效果似乎很好

code {
  font-family: "Comic Sans MS", cursive, sans-serif;
  display: block;
  height: 20px;
  padding: 2px;
  margin: 4px;
  background-color: #7FECFF;
  text-align: center;
}

---

这就是我在小提琴上的感受：

指定为40px宽的代码，因此该部分的文本太大

---

我建议将宽度调大，或者删除宽度并浮动元素，这样它将占据内容的宽度

我把你的代码转换成了一个实例，效果很好。您共享的代码不可能暴露此问题。漫画SAN可能是一个问题。；）您可以使用css验证器来检查代码是否有错误：您已经为“code”的宽度设置了40px，但文本长度超过40px。如何删除宽度参数并同时删除display:block？

see fiddle