【问题标题】:my div content wont align left as my css specifies我的 div 内容不会像我的 css 指定的那样左对齐
【发布时间】:2013-11-15 14:58:07
【问题描述】:

我正在尝试使我的内容在 div 内左对齐...代码如下...我做了一次这项工作,但丢失了代码。现在我想不通了。

HTML5:

<div class="wrapper materials">
<section id="materials">

然后我做一个文章标签 然后我创建文章内容,包括 h 标签、p 标签等。 然后我关闭标签 然后我关闭 div

css:

.materials {
    width: 80%;
    background-color: #fff;
    margin-left: auto;
    margin-right: auto;
    text-align: left; 
}

材料包装中的文本保持居中,但我希望它向左对齐。

【问题讨论】:

    标签: css html text-alignment


    【解决方案1】:

    首先,您将materials 用作classid,因此如果您将持有materials 的元素定位为id,那么您需要使用#materials 而不是.materials

    #materials {
        width: 80%;
        background-color: #fff;
        margin-left: auto;
        margin-right: auto;
        text-align: left; 
    }
    

    除此之外,唯一可能的情况是您可能有一些更具体的选择器覆盖了您的 CSS 块,请尝试使用

    #materials {
       text-align: left;
    }
    

    【讨论】:

    • 我确实在这里看到了一件事...我在另一个中打开了我的 div 用于特定的设计目的...当我使用 #materials 时它让事情看起来有点奇怪...跨度>
    • @user2994997 实际上两者是不同的,使用# 将选择具有id 材料的子元素,而. 将针对具有materials 类的父元素,因此您需要知道要做什么使用,使用#materials 将占用它的父元素的80%,你可能不需要它,我也不知道你在做什么,所以在没有任何具体解释的情况下解释你可能会很模糊:)
    • abeautifuldayforyou.net/continuing-education-courses/… 这个样子除了节内的文字应该左对齐
    • @user2994997 我想告诉你,仓位从一开始就红红火火,浮动没有被清除,你的基础知识彻底吗?我的这个答案也将帮助您了解浮动的行为以及如何清除它们stackoverflow.com/questions/12871710/why-clear-both-css/…
    • 只能说我是……新手!
    【解决方案2】:

    您的班级.wrappertext-align: center。建议根据案例使用来查看和简化您的样式表。例如,您希望哪些文本位于 .wrapper 类的元素中?如果你指定了这些情况,那么只有包装器中的那些元素会居中。

    或者,如果您希望 .wrapper 中除 .materials 之外的所有内容都居中,请按如下方式指定:

    .wrapper.materials {
        text-align: left;
        width: 80%;
        margin: 0 auto;
    }
    

    通过以这种方式将两者结合起来,您是在告诉浏览器不要在它们不同的地方选择一个类而不是另一个类,而是将它们视为一种特殊的、明确的情况。

    【讨论】:

      猜你喜欢
      • 2023-01-12
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2021-03-31
      • 1970-01-01
      • 1970-01-01
      • 2014-08-19
      • 1970-01-01
      相关资源
      最近更新 更多