gpt4 book ai didi

html - CSS 颜色不显示

转载 作者:太空宇宙 更新时间:2023-11-04 00:24:32 24 4
gpt4 key购买 nike

我对使用 HTML 和 CSS 很陌生,我正在尝试创建一个矩形框 -

<html>
<head>
<link rel="stylesheet" type="text/css" href="style2.css" />
<link rel="stylesheet" type="text/css" href="stylesAgg.css" />
</head>
<body>
<h1>Testing the class page</h1>

<ul>
{% for book in books %}
<div id ="bookInfo" style = "display">
<div>
<text class= "text" id = "bookTitle">{{ book.title|safe }}</text></br>
<text class= "text" id= "bookAuthor">by {{ book.author|safe }}</text></br>
</div>
</div>


{% endfor %}
</ul>

</body>

</html>

我的CSS代码在这里-

#bookInfo {
float:right;
width:700px;
height:300px;
background-color:#dd2424;
padding-left:12px;
padding-top:17px;
}

为什么我的 html 页面不显示彩色矩形?

谢谢!

编辑-我已经包含了下面的所有建议,但它仍然不起作用——但是,当我通过 Firebug 查看页面时,它说没有规则(尽管我有样式表,但还是有一些 404 错误)——我认为这是问题所在 - 我该如何解决?

最佳答案

ID 在 HTML 页面中应该是唯一的。要使用相似规则格式化页面上的多个元素,请使用 class属性。尝试更改 id您的 div 上的属性到 class .同时更改您的 CSS #bookInfo.bookInfo .

此外,<ul>开始一个无序列表。 唯一 允许直接在其中使用的标记类型是 <li>在该列表中创建一个条目。 <div>这里不允许。您可以更改 <div><li>或者只是删除 <ul>完全取决于您的实际语义需求。

另一个错误的用法是你的 </br>标签。如果标签以 </ 开头它被认为是结束标签,而不是 <br/>这是一个空标签,可能就是您在这里的意思。

作为样式的最后建议,您应该坚持所有较低的类和 ID。它使调试更容易并且看起来更好。

关于html - CSS 颜色不显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7414627/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com