html - 未应用 CSS 样式 : Head First HTML Example

标签 html css

我刚开始阅读 HeadFirst HTML 和 CSS 这本书。在本书的以下示例代码中,当我在 IE/Firefox/Chrome 中查看时,HTML 代码中的 CSS 样式没有得到应用。

<html>
<head>
<title>Starbuzz Coffee</title>
<style type=”text/css”>
body {
background-color: #d2b48c;
margin-left: 20%;
margin-right: 20%;
border: 1px dotted gray;
padding: 10px 10px 10px 10px;
font-family: sans-serif;
}
</style>
</head>
<body>
<h1>Starbuzz Coffee Beverages</h1>
<h2>House Blend, $1.49</h2>
<p>A smooth, mild blend of coffees from Mexico, Bolivia and
Guatemala.</p>
<h2>Mocha Caffe Latte, $2.35</h2>
<p>Espresso, steamed milk and chocolate syrup.</p>
<h2>Cappuccino, $1.89</h2>
<p>A mixture of espresso, steamed milk and milk foam.</p>
<h2>Chai Tea, $1.85</h2>
<p>A spicy drink made with black tea, spices, milk and honey.</p>
</body>
</html>

您能评论一下为什么它没有按预期工作吗?尽管我使用与上面相同的代码从互联网上下载了一个文件 index.html,但它给出了预期的输出。

谢谢,

最佳答案

你写了 type=”text/css” 它需要是 type="text/css"

属性值通常用 U+0022 : QUOTATION MARK 字符分隔。还有其他有效选项,但您使用的不是其中之一。U+201D : RIGHT DOUBLE QUOTATION MARK

A validator会捡起来的。

您的问题可能是由使用文字处理器编写代码引起的。使用文本编辑器(例如 Sublime Text、Atom 或 Brackets)。

关于html - 未应用 CSS 样式 : Head First HTML Example,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31669091/

相关文章:

html - 上下颠倒的 CSS 方向?

javascript - 鼠标滚轮事件触发过于频繁/许多滚动会破坏动画

javascript - 全后台更改jquery

javascript - Interactjs 旋转改变位置

android - Android WebView 是否支持 html5?

html - 仅水平滚动的 Div

html - 如何在绝对容器底部放置粘性页脚

CSS Grids 嵌套和自动填充高度问题

php - 来自在主页上循环的类别的 wordpress 随机帖子

javascript - jQuery .load() 另一个包含 prism.js 的页面