当前在将.css文件与html脚本结合使用时遇到问题。目前我的index.html看起来如下:
<!DOCTYPE html>
<html>
<head>
<title>Bellamy Terminal</title>
<link rel = "stylesheet" type = "text/css" href = "../CSS/style.css">
</head>
<body class="css-theme">
<h1><strong>Bellamy Terminal</strong></h1>
</body>
</html>
接下来,在另一个目录/文件夹中,我标记了CSS,下面是CSS脚本:
/* Theme of Site */
.css-theme {
color: lime;
background-color: black;
font-family: Lucida Sans Typewriter;
}
/* Theme of Site End */
h1 {
text-align: center;
}
主要的问题是我的h1元素不会居中;美妙的"开始我的网站,哈哈。非常感谢你的帮助!我正在使用firefox
没有float: center;
,而是使用text-align: center
。在选择器中使用h1
,而不是.h1
——这不是一个类。所以你的完整规则是:
h1 {
text-align: center;
}
另一个注意事项是:在HTML代码的任何地方都没有一个名为css-theme
的类,所以您不能期望该规则应用于任何地方。
添加:
1.(可能还有一个文件路径问题(在样式表的链接中(,但如果不知道您的文件结构,就不可能给出确切的说明。您可以尝试href=../CSS/style.css
(注意第一个斜线前的两个点(,但这只是猜测。
2.(您的<style>
和<title>
标记应该包装在<head>
标记中(通常包含更多(,并且<link>
标记应该而不是位于<style>
标记内,以生成有效的HTML代码。
首先,doctype
应该在单词doctype
之前有bang(!
(。
接下来,link
元素确实属于head
,但不属于style
内部。
此外,虽然可以将class
添加到body
元素中,但您可以通过为body
设置CSS选择器并从HTML中删除class
来实现相同的结果,这通常是首选,这样HTML就不会那么杂乱。
此外,strong
旨在从语义上传达重要性,通常会使与其一起使用的元素显示为粗体。如果您所追求的只是粗体,则此处不需要strong
,因为默认情况下所有标题元素都将使用粗体。
而且,若您在一个相对的URL前面加上/
,它将始终在您的站点的根目录中查找该资源,这可能是您想要的,也可能不是您想要的。如果CSS
文件夹是当前页面的子文件夹,请不要在URL前面加上/
,只需说出文件夹的名称即可:CSS/style.css
。
/* Theme of Site */
/* If you make a tag selector, you don't have to add a class to the element */
body {
color: lime;
background-color: black;
font-family: Lucida Sans Typewriter;
}
/* Theme of Site End */
h1 {
text-align: center;
}
<!DOCTYPE html>
<html>
<head>
<title>Bellamy Terminal</title>
<link rel = "stylesheet" type = "text/css" href = "/CSS/style.css">
</head>
<body>
<h1>Bellamy Terminal</h1>
</body>
</html>