html - 无法获取背景颜色以填充我页面中的适当部分 (HTML/CSS)-6ren

html - 无法获取背景颜色以填充我页面中的适当部分 (HTML/CSS)

转载作者：太空宇宙更新时间：2023-11-04 05:13:37

24

4

您好，我的 html 和 css 代码有问题。每当调整大小时，我都试图将所有内容在浏览器中居中对齐，但要保持背景颜色连续水平流动。我有以下代码，但背景颜色似乎与我页面中的某些部分重叠。我错过了什么或做错了什么？非常感谢

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<style>
body {
    width:auto;
    font-family:Century Gothic, Arial, Verdana;
}

.wrapper {
    width:850px;
    margin-left:auto;
    margin-right:auto;
    margin-top:0px;
    margin-bottom:0px;
}

h4 {
    color: #db870a;
    font-size:16px;
}

.threeCol {
    display:block;
    float:left;
    width:30.50%;
    padding:30px 0px;
    text-align:justify;
}

/*Alterations*/
.noSpaces {
    margin:0px;
    padding:0px;
}

.float {
    float:left;
}

.alignR {
    text-align:right;
}

.paddingR {
    padding:10px 30px 10px 0px;
}

.paddingL {
    padding:10px 0px 10px 30px;
}

.noPadding {
    padding: 10px 0px 10px 0px;
}


/*footer*/

#footer {
    display:block;
    background-color:#F60;

}


/*Other Articles*/

#otherArticles {
    font-size:12px;
}

</style>



<body>

<section id="otherArticles">
    <div class="wrapper">
    <article class="threeCol paddingR">
      <header><h4 class="noSpaces">Lorem ipsum dolor sit amet</h4></header>
      <p>Rutrum vitae vestibulum condimentum metus. Donec magna leo sapien augue tellus, phasellus erat, adipiscing lectus phasellus enim nulla, eu aliquam sodales</p>
    </article>

      <article class="threeCol paddingR">
      <header><h4 class="noSpaces">Lorem ipsum dolor sit amet</h4></header>
      <p>Rutrum vitae vestibulum condimentum metus. Donec magna1leo sapien augue tellus, phasellus erat, adipiscing lectus phasellus enim nulla, eu aliquam sodales</p>
    </article> 

        <article class="threeCol noPadding">
      <header><h4 class="noSpaces">Lorem ipsum dolor sit amet</h4></header>
      <p>Rutrum vitae vestibulum condimentum metus. Donec magna leo sapien augue tellus, phasellus erat, adipiscing lectus phasellus enim nulla, eu aliquam sodales</p>
    </article>
    </div
></section>

<br />

<footer id="footer">
<div class="wrapper">
    Rutrum vitae vestibulum condimentum metus. Donec magna leo sapien augue tellus, phasellus erat, adipiscin</div>
</footer>

</body>
</html>

最佳答案

例子

http://jsfiddle.net/amkrtchyan/DtgQR/

当你写一个 html5 实际上是一个 html5 文档类型 <!DOCTYPE html>

关于html - 无法获取背景颜色以填充我页面中的适当部分 (HTML/CSS)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/8723473/

24

4

0

文章推荐： css - cufon hover 在鼠标离开后保持悬停状态。

文章推荐： linux - 如何永久授予用户 sudo 访问权限？

文章推荐： python - 使用 SUDS 将多个参数传递给 SOAP web 服务

文章推荐： linux - 如何设置当前日期 + 14 天的 cron 表达式

typescript - A 部分部分 io-ts
我在使用 io-ts 时遇到一些问题。我发现它确实缺乏文档，我取得的大部分进展都是通过 GitHub issues 取得的。不，我不明白 HKT，所以没有帮助。基本上，我在其他地方创建一个类型，ty
java - 匹配完整文件正则表达式中的 A 部分，但不匹配 B 部分
我必须创建一个正则表达式来搜索整个文件，以找到与 Java XML 解析器的第一部分(但不是第二部分)的匹配项。这将用于防止某些 XXE 攻击。不幸的是，它确实必须是单个正则表达式，并且它确实需要搜索
c# - 部分/部分中的 asp.net mvs 部分？
我有一些简单的 Shared/_Header.cshtml 文件中的内容。 My Shared/_Layout.cshtml 通过调用插入该代码 @Html.Partial("_Header") 目前
java - Selenium 只执行循环的 if != null 部分，不运行循环的 "else if null "部分
我有一个 if-else 语句，其中: 条件 1:ID 匹配并且自动填充某些字段。然后 if 语句只填充其余字段条件 2:ID 不匹配，所有字段均为空白。 ELSE 语句将它们全部填充当我使条件
javascript - 无法在 JSFIDDLE 中使用滚动魔法(第 1 部分，共 2 部分)
我正在开发一个单页滚动网站。我正在尝试实现 ScrollMagic 并固定第一部分，以便网站的其余部分滚动到固定部分的顶部。我尝试创建一个 jsfiddle 来显示问题，但我似乎无法让 jsfiddl
javascript - 既然有

首页

博学

6Ren·AI

商城

html - 无法获取背景颜色以填充我页面中的适当部分 (HTML/CSS)