代码之家 › 专栏 › 技术社区 › compilingJohnny

CSS样式未生效

stylesheet css html

compilingJohnny · 技术社区 · 9 年前

以下是HTML:

<div id="contact-details">
    <p id="contact-details-first">
        <h3>Address:</h3>
        <ul>
            <li>238 Parsley</li>
            <li>Annlin, Pretoria</li>
            <li>South Africa</li>
        </ul>
    </p>
</div>

下面是CSS:

#contact-details {
    width: 80%;
    background-color: #ddd;
    margin: auto;
}

#contact-details-first > h3 {
    display: inline-block;
    float: left;
    border: 1px solid yellow;
}

#contact-details-first > ul {
    position: relative;
    left: 100px;
    border: 2px solid blue;
}

出于某种原因,底部的两个css样式不起作用。

#contact-details-first > h3
#contact-details-first > ul

2 回复 | 直到 9 年前

Kristijan Iliev Gaurav Karia 9 年前

不能在段落中嵌套块元素。

如果您更改 p 具有 div ,例如:

#contact-details {
    width: 80%;
    background-color: #ddd;
    margin: auto;
}

#contact-details-first > h3 {
    display: inline-block;
    float: left;
    border: 1px solid yellow;
}

#contact-details-first > ul {
    position: relative;
    left: 100px;
    border: 2px solid blue;
}

<div id="contact-details">
<div id="contact-details-first">
	<h3>Address:</h3>
	<ul>
		<li>238 Parsley</li>
		<li>Annlin, Pretoria</li>
		<li>South Africa</li>
	</ul>
</div>
</div>

Krish 9 年前

ul 和 heading 不允许在的内部 paragraph 改变 p 标记到div。

#contact-details {
    width: 80%;
    background-color: #ddd;
    margin: auto;
}

#contact-details-first  h3 {
    display: inline-block;
    float: left;
    border: 1px solid yellow;
}

#contact-details-first  ul {
    position: relative;
    left: 100px;
    border: 2px solid blue;
}

<div id="contact-details">
  <div id="contact-details-first">
    <h3>Address:</h3>
    <ul>
      <li>238 Parsley</li>
      <li>Annlin, Pretoria</li>
      <li>South Africa</li>
    </ul>
  </div>
</div>

推荐文章

laurapons · 更改QTreeView特定列的文本颜色

7 年前

sick_cherry · 以编程方式添加样式表ASP。NET(VB)

7 年前

miatech · 两个按钮在simon游戏中不会居中

7 年前

four-eyes · 放置右上角react native

7 年前

user123 · 为什么标签称为链接?[已关闭]

7 年前

compilingJohnny · CSS样式未生效

9 年前

Sammy I. · JQuery没有删除类?

10 年前

gigi · 使用css设置Divs的样式

10 年前

Marco · Extjs更改显示字段的字体大小

11 年前

Chris Aung · PyQt4样式表小部件的组件名称

11 年前