Question

基于我使用的结构，标题部分位于换行div中。此包装div具有设置宽度

width: 1000px;

但我希望我的标题超过此1000px宽度，我希望标题是浏览器的整个宽度！

你可以在我的jsfiddle中看到代码：https://jsfiddle.net/7eLnegvd/ 您可能需要扩展预览部分的宽度，以便您可以看到标题不会填充100％的宽度。

谢谢！

Answer 1

为什么不改变你的方式？不要把标题标记放在你的包装div中。使用语义标签，如标题标签，主标签，页脚标签和...外部div包装器和样式标头标签分开LIKE A BOSS！

HTML：

<body>

<header>header</header>
<div class="wrapper">body</div>
<footer>footer</footer>

</body>

CSS：

*{
    box-sizing: border-box;
    text-align: center;
    font-size: 30px;
    color: white;
}

header,
footer{
    width: 100%;
    height: 100px;
    background-color: black;
}

.wrapper{
    width: 1024px;
    height: 2000px;
    background-color: gray;
}

Answer 2

只需删除System.out.println("START!"); for (int i = 0; i < 4; i++) { Random rd = new Random(); int a = rd.nextInt(7) + 2; int b = rd.nextInt(7) + 2; System.out.print(a + "*" + b + "= "); int result = sc.nextInt(); if (result == a * b) { System.out.println("^OK"); correct++; } else { System.out.println("^NOPE"); incorrect++; } } System.out.println("\nCorrect: " + correct + "\tIncorrect: " + incorrect);，默认情况下，包装器将是一个块元素，它是页面的整个宽度

Answer 3

如果您希望元素的width属性为最大宽度，则可以使用百分比而不是像素。您还可以为代码添加其他宽度属性，并设置所需的最小或最大宽度。

CSS示例：

#wrap {
min-width: 5em;
max-width: 100%;
}

此外，建议将CSS3 @media Rule用于此类设计，以使其更具响应性。

标题包装内100％宽度

3 个答案: