伪类元素z索引问题
伪类元素是CSS中用来选择元素的一种特殊方式。它们用于给某些元素的特定部分应用样式，而不需要为其添加额外的HTML标记。伪类元素通常在选择器中使用冒号(:)来标识。
在CSS中，伪类元素z索引问题是指使用伪类元素时，它们在层叠顺序（z-index）上的表现问题。层叠顺序决定了元素在页面上的堆叠顺序，具有更高层叠顺序的元素会显示在更低层叠顺序的元素之上。然而，伪类元素（如:before和:after）默认具有一个较低的层叠顺序，导致它们可能被其他元素遮挡。
为了解决伪类元素z索引问题，可以使用以下方法：
- 使用position属性：将伪类元素的position属性设置为relative、absolute或fixed，并使用z-index属性来调整它们的层叠顺序。通过将伪类元素的position属性设置为relative，并为其添加一个较高的z-index值，可以将其置于其他元素之上。
- 调整HTML结构：通过修改HTML结构，将伪类元素放在需要它们覆盖的元素之后。这样，伪类元素就会自然地显示在其他元素的顶部。
- 使用CSS伪类选择器：有时，可以通过选择器的更改来解决伪类元素的层叠顺序问题。尝试使用更具体的选择器，或者为伪类元素添加额外的class或id，以提高其优先级。
推荐的腾讯云相关产品： 腾讯云CDN（内容分发网络）：https://cloud.tencent.com/product/cdn 腾讯云CSS（云服务器）：https://cloud.tencent.com/product/cvm 腾讯云CLB（负载均衡）：https://cloud.tencent.com/product/clb 腾讯云SSL证书：https://cloud.tencent.com/product/ssl 腾讯云WAF（Web应用防火墙）：https://cloud.tencent.com/product/waf
相关·内容
其结果是：
看看链接是如何超过数字的
我试着改变before元素的z索引并使其变大，但是这条线保持在数字之上，
你能帮忙吗？这一行的代码是
#progressbar li:after {
content: '';
width: 100%;
height: 2px;
background: black;
position: absolute;
left: -50%;
top: 9px;
z-index: 0; /*put it behind the numbers*/
}
这是个骗局
浏览 1提问于2014-06-16得票数 0
回答已采纳
2回答
我已经创建了一个“header”元素，其中包含了一个之前的伪元素。pseudeo元素必须在父元素之后。一切都很好，直到我给我的“头”一个z索引的那一刻。
我想要的是:黄色的“header”在前景，红色的伪元素在背景中，黄色的“header”元素上有一个简单的z索引30。
header {
background: yellow;
position:relative;
height: 100px;
width: 100px;
z-index:30; /*This is the problem*/
}
header::before {
conte
浏览 2提问于2011-10-19得票数 22
回答已采纳
我希望绿色元素在文本框下，也在图像下面。
我试着为每个元素设置z索引，但是没有什么改变。
我能通过z-index属性达到这个目的吗？
我不能改变html。并且我还希望伪元素成为自适应高度的文本块的子元素。
.item {
display: flex;
align-items: flex-start;
width: 400px;
height: 250px;
}
.col1 {
margin-right: 20px;
}
.col2 {
position: relative;
z-index: 1;
width: 200px;
height: auto
浏览 2提问于2017-11-15得票数 1
回答已采纳
我有一个父母<div>和一个孩子<a>。父程序将背景图像设置为60%的不透明度，但我希望子链接具有100%的不透明度。我以这种方式实现它的原因是，我可以在悬停时将父级的不透明度降低到100%，从而消除对悬停图像的需要。
我知道孩子们继承了父母的不透明。我尝试了描述:after {}的技术，但是即使设置了适当的z-index值，子链接仍然位于父元素的下方，不能单击。
我的问题是，不能单击子链接，因为父元素的:after 伪元素位于子元素的上方。
我的代码如下：
<div>
<a href="#">Load more</a&
浏览 0提问于2013-05-02得票数 0
回答已采纳
浏览器: Chrome版本71.0.3578.98 (64位)
我试图创造一种简单的方法，在没有编辑Photoshop图像的情况下在背景上设置一个不透明的图像，但是当我使用一个绝对定位的：：preventing，在一个位置内: relative；parent，它会阻塞该部分中的输入，阻止任何人使用它们；尽管背景图像显示在父母的孩子的后面。当我注意到这一点时，我尝试设置：：pseudo z-index: 0；以及父到z-index: 1；它没有解决问题。但是，当我将父类设置为z-index: 0；而伪类设置为z-index：-1时，它工作得很好。
为什么它必须是z指数0和-1而不是前者？
/
浏览 0提问于2019-01-23得票数 0
回答已采纳
1回答
我有个z指数的堆叠顺序问题。有几个问题，所以实际上是处理这个问题，但我无法解决这个问题，尽管阅读了一些深入的文章关于Z索引，一号。
现在我面临的问题是，我有以下CSS：
.grey-box {
position: relative;
padding: 50px 0;
background: #eee;
z-index: 9999999;
}
.grey-box:after {
content: '';
position: absolute;
top: 100%;
height: 30px;
width:
浏览 5提问于2015-04-18得票数 1
回答已采纳
2回答
我想把黑色矩形(:after)放在索引后面，但是z- h2不起作用。
我有这段html格式的代码
<h2>Ce que tu auras peut-être un jour ou l'autre...</h2>
在CSS中是这样的：
#general .page h2 {
position: relative;
text-indent: -9999px;
width: 718px;
margin-bottom: 50px;
height: 116px;
z-index: 10;
background: url(img/banniere-hi-04.png);
浏览 0提问于2013-03-14得票数 2
回答已采纳
2回答
背景叠加和z索引
、、、
你知道我们是如何像下面这样的代码为背景图像或颜色做一个覆盖。
HTML
<section id="hero">
<div class="hero container">
<div>
<h1>Hello, My Name is </h1>
<a href="#" type="button" class="cta">Porfolio</a&
浏览 8提问于2022-09-04得票数 0
1回答
我正努力想办法解决这个问题。我有一个article，它有两个元素被插入，:before和:after，这两个元素都被绝对地放置在那篇文章中。
在除IE8之外的所有浏览器中，z索引堆叠都运行得很好。它应该从下到上按顺序排列：
文章内容>淡出图像>图标
我已经尝试过几种不同的东西，其中最新的可以在这里看到：
我正在尝试的基本内容如下所示：
article {
// styles
}
article:before {
// icon background image used on inserted content
}
article:after {
// b
浏览 6提问于2012-10-03得票数 4
3回答
我正在尝试用CSS创建一个非常简单的模式，并希望使用一个单一的DOM元素的'vignette‘和主要内容。到目前为止，我有：
<div class="modal"></div>
.modal {
position: fixed;
top: 20%;
left: 50%;
right: 50%;
width: 620px;
margin: 0 -320px;
height: 540px;
background: $white;
z-index: 4000;
}
/* Vignette */
.modal:bef
浏览 2提问于2013-07-05得票数 7
回答已采纳
1回答
我有一个水平导航，它的三角形边框插入了:在列表项目之前和之后，使它看起来好像在列表项目的右侧有一个白色的边框。它是用FF和Chrome呈现的，而不是IE8，我使用的是html5文档类型，并包含了html5.js。
似乎列表项的背景色被堆放在箭头边框的顶部，因此无法被看到，因为如果我关闭背景颜色，就可以看到箭头。我想这可能是个z指数问题，但也没什么用。我在IE中也注意到，所有的:在风格被删除后，有什么想法吗？
<html>
<head>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.
浏览 2提问于2013-11-14得票数 0
2回答
我有一个CSS类，它输出标题后面的一行
这在Safari和Chrome中是可行的，但在Firefox中却没有出现这种情况。
我的守则：
.sidebar h2 {
color: #f7f7f7;
width: 100%;
font-size: 24px;
position: relative;
}
.sidebar h2 span {
background-color: #40d1b0;
padding-right: 2px;
}
.sidebar h2::after {
content:"";
pos
浏览 10提问于2015-01-02得票数 5
回答已采纳
1回答
考虑一下： <div class="auth-form-frame">
Some very long text
</div> 如果我给.auth-form-frame::before一个背景色，文本就会变得不可见： .auth-form-frame {
position: relative;
width: 50rem;
height: 25rem;
color: #000;
font-size: 10rem;
&:before {
content: "";
浏览 21提问于2021-09-19得票数 1
回答已采纳
我在fcc做一个项目，他们告诉一个移动友好的替代背景附件问题#1：：在问题2之前，z索引的用途是什么？
body::before {
content: '';
position: fixed;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: -1;
background: var(--color-darkblue);
background-image: linear-gradient(
115deg,
rgba(58, 58, 158, 0.8),
浏览 5提问于2022-06-05得票数 -1
回答已采纳
1回答
如何改变李飞的z指数？
、、、
我有一个<ul>，其中包含有图像的<li>。我想让每个图像缩放到一个更大的悬停尺寸，以及变得不透明。但是，在悬停时，当图像变得更大时，它会被下一个图像所覆盖。我不确定我是否把z-index放在正确的地方.下面是我到目前为止拥有的css代码：
.artgallery {
background-color:rgba(255,255,255,0.8);
color:#fff;
width:100%;
padding:0px;
margin:0;
height:80%;
overflow:auto;
positio
浏览 5提问于2013-12-27得票数 1
回答已采纳
1回答
我在一个页面上显示一个图像，我希望添加一个面具，以实现特定的边界和角落的效果。
为此，我希望以以下方式使用伪元素：
img
{
height: 58px;
left: 0;
position: absolute;
top: 0;
width: 58px;
z-index: 1;
&:after
{
background-image: url(images/frame.gif);
content: " ";
height: 58px;
浏览 3提问于2013-11-05得票数 0
回答已采纳
我正在尝试使用:after的伪元素CSS选择器设置元素的样式。
#element {
position: relative;
z-index: 1;
}
#element::after {
position:relative;
z-index: 0;
content: " ";
position: absolute;
width: 100px;
height: 100px;
}
似乎::after元素不能低于元素本身。
有没有办法让伪元素低于元素本身？
浏览 2提问于2010-06-13得票数 344
回答已采纳
1回答
我在我的网站的一个页面上有一个iframe视频： (等待动画结束，视频显示，~30秒animation...and很有可能服务器宕机了，选择了有史以来最糟糕的免费主机)。
我遇到的问题是，当我全屏显示时，我有一个覆盖在视频(.team_container < .team_row [code at bottom]);上的div，当全屏显示视频时，容器停留在视频顶部。我尝试将视频容器的z-index设置为2147483647，但无济于事。唯一有效的解决方案是将覆盖的div (.team_container)的z-index设置为-1，但它使该div中的链接不可点击。
有没有办法只在视频全屏时
浏览 0提问于2015-09-07得票数 1
我正在尝试创建一个包含循环的方法，该循环可以创建新的Raindrop对象并将它们插入到列表中。每个Raindrop对象都有一个构造函数，它接受一个int，它表示雨滴的Z索引。
现在的问题是，我想用更低的z索引比更高的z索引创建更多的水滴。
我有这个方法：
public void createRainDrops(int amount, int startIndex, endIndex) {
for (int i=0; i<=amount; i++) {
//what goes here?
dropList.add(new Drop(zIndex))
浏览 0提问于2017-05-28得票数 1
2回答
<div></div>
<div></div>
<style>
div {
width: 90px;
aspect-ratio:1;
border-radius:50%;
transform:translateY(-15px);
background:#191919;
box-shadow:0 0 0 13px #E08027;
position:relative;
}
div::after{
content:"";
position:absolute;
width:55px
浏览 4提问于2021-11-08得票数 1
回答已采纳
1回答
CSS Z索引：-1
、、、
我有一个元素，在本例中是安莉，并定位了它的相对位置，然后从它得到了一个:after伪元素。它有"“的内容，绝对定位，有一个位置和维度和一个方框阴影。我已经将它的z-index设置为-1，问题是它又回到了我的页面上最底层的z索引元素。我预计它会后退1位，这样就会落后于li。
我关注的是：
有什么想法吗？如果我将伪函数的z-index设置为1，那么它会跳到li函数的前面，我只想让它在它后面一个停靠点。
浏览 0提问于2013-06-06得票数 0
回答已采纳
我有一个动画电影片，包含照片的，但无法使电影片浮动在照片的顶部，通过调整z索引值。我尝试过菲利普·沃森( Philip )所描述的工作，他建议修改不透明值以改变堆叠上下文，但我在实现它时遇到了困难。目前，我的位置设置为相对位置，但z指数仍然无效。我的代码可以在这里看到：
在这里放映的电影片：
谢谢你帮忙解决这个恼人的问题。
浏览 2提问于2013-09-26得票数 1
回答已采纳
1回答
我对网页设计很陌生。我正在学习CSS，并且非常喜欢它的可能性。我的问题可能是相当简单的解决办法，但我似乎找不到答案。
我想有一个好的开始与CSS，这意味着有一个良好的布局。所发生的是我设计我的网站，并使他们所有的设置在DW。我开始构建CSS，当我测试它们时，我得到了ie6的z索引错误，7。我的位置是绝对的和相对的。事情似乎/消失了。我把我的导航条在FW所以他们是定制的设计。他们工作很好的滚动效果，出口到DW，然后我就会遇到问题。
有人能帮我理解我的错误吗？如果有帮助的话我可以给你看密码吗？我知道我会成为CSS的拥护者，因为我不想从表格开始学习，我听说过这个古老而复杂的系统的恐怖故事。
谢谢你帮
浏览 0提问于2010-12-17得票数 1
1回答
我陷入了一些我不太明白的关于z指数的事情。我已经读了很多关于z索引并不像人们想象的那么直接，所以在我自己尝试了所有事情之后，我将尝试指定我的问题，希望能找到解决方案！
对我来说，它可以归结为四个项目，使它变得复杂：
带有z-index: 0背景色的一行。
1 fixed div，随z-index: 1滚动。
带有z-index: 2背景色的一行(这应该放在fixed div的顶部)。
1 fixed 菜单和z-index: 3 (这应该是最重要的)。
我的问题是，我的菜单将放在与z index: 2的行下面，尽管它有z-index: 3，而且由于fixed div with z-index:
浏览 4提问于2016-11-10得票数 0
回答已采纳
1回答
根据我的理解，::before应该出现在元素下面，而::after应该出现在元素的上方(以z索引表示)。
在下面的示例中，当一个人悬停在按钮上时，我试图使背景颜色更暗(而不是前景色)。即使我使用了::before，它仍然出现在前面。为什么？我知道我可以用z-index来修复它，但是根据的说法，它有6个问题：
，我认为最好使用:在此之前，您可以得到正确的堆叠顺序，而不必使用z索引。
我不应该这样做，而且命令应该是正确的？
.parent {
--my-color: red;
}
button {
color: blue;
background-color: var(
浏览 8提问于2022-10-28得票数 -1
2回答
更新(抱歉，我正在尝试编辑)我将使用的书签如下：
我正在为一个网站制作书签，但当我使用'z-index‘时，它不起作用。(见下图) :(
我在这个网站上看到了一些关于这个问题的帖子，我试着修改代码，但它仍然不起作用。
这是代码的链接：
或者，如果您愿意：
.fix {
padding: 30px;
}
.box {
border-bottom: 3px solid #bebebd;
margin-bottom: 25px;
background-color: #fff;
box-shadow: 0px 0px 9px #D4D4D4;
z-i
浏览 7提问于2015-08-17得票数 1
我是Selenium web驱动程序的新手，我在定位DOM元素时遇到了一些问题。
假设我有一堆<div class="column">...</div>，在它们里面，我有一堆<div class="text">...</div>。
我的问题是：，获取特定后代并单击它的更好方法是什么？
在我的代码下面
var driver = new webdriver.Builder()
.forBrowser('chrome')
.build();
driver.get('http://www
浏览 0提问于2018-12-17得票数 1
回答已采纳
我有一个联系人列表，它是作为一个无序列表生成的，其中为每个列表项分配了HTML5 data属性。data属性值是用于字母排序的单个字母。我无法控制生成的标记，但是我需要在每个字母的第一个条目之前插入一个节标题。我希望用:before伪元素来实现这一点。没什么不寻常的。我选择的CSS选择器有很大的自由度，因为这个项目只支持IE9+。
示例标记：
<ul>
<li data-name="a"> ... </li>
<li data-name="a"> ... </li>
<li
浏览 4提问于2013-09-25得票数 4
回答已采纳
我希望在CSS中，前将呈现在容器之前，后将呈现在后面。就像这样
前面: z-index = 0，容器: z-index = 1，以及后面: z-index =2
但顺序是: z-index = 1，容器: z-index = 0，后面: z-index =2。
HTML：
<div id=theDiv>DIV</div>
CSS：
#theDiv{
position:relative;
width:100px; height:100px;
background-color:red;
margin:50px;
}
#theDiv:before{
con
浏览 5提问于2016-12-08得票数 0
回答已采纳
所以我有一个纯风格的div，前面有一个：，它位于一个图像下面，css看起来像这样：
.the-image-div {
width: 100px;
height: 100px;
box-shadow: inset 0px 0px 3px white;
border: 1px gray solid;
position: relative;
z-index: 3;
}
.image-stack {
width: 100px;
height: 100px;
background: white;
border: 1px s
浏览 0提问于2013-01-04得票数 2
回答已采纳
1回答
我有一个div显示一个图像，然后有一个半高半透明块，我在上面写文字。这是使用一些代码从这个网站，利用“之前”。如何在悬停时隐藏这个透明块？我已经尽我所能了。我不能使用标准的透明图像，因为图像在div的每个实例上都是不同的，而且它们不在站点上。使用:以前用这种方式不是我完全理解的事情，而是怀疑它是复杂的事情。
.summary_props_trans {
position: relative;
font-family:'Melbourne', Arial, sans-serif;
font-size: 2vmin;
color: black;
fo
浏览 0提问于2015-03-24得票数 1
回答已采纳
1回答
下面是我不太明白的关于z-index和css伪元素：：and / ::after的行为。
它是在这个小提琴：上演示的。
我创建了一个定位框，并在伪元素之后添加了内容(也是定位的)。
如果在伪元素之后将z-index设置为：：，则一切正常，并且可以通过使用z-index将其定位在父元素的上方或下面。
#no-z-index {
background:lightblue;
width:100px;
height:100px;
position:relative;
}
#no-z-index:after {
浏览 3提问于2013-04-13得票数 7
回答已采纳
我想在一些容器上设置一个伪元素边框，但不包括第三个。我认为我可以将伪选择器与:not结合使用，比如：div:before:not(nth-child(3))，但它似乎不起作用。
那么:not选择器和伪选择器是不兼容的吗？在这种情况下，我如何才能将伪元素放入其中并排除某些特定元素呢？
(顺便说一句，伪元素边框的想法是控制边框，使它们保持在顶部，无论顶部是否有覆盖(虽然还没有看到它是否有效)
这是一把小提琴：(没有可见的边框，因为有not:(nth-child(3))选择器)
以下是小提琴中的代码：
HTML：
<div class="ctr">
<div&
浏览 15提问于2017-07-18得票数 0
回答已采纳
如何将:前跨后？我知道我以前做过但我不记得是怎么做的。这是小提琴。
<span>Stack Overflow</span>
CSS
span{
background:#000;
position:relative;
color:#fff;
z-index:20;
}
span:before{
content:'';
background:#000;
position:absolute;
left:50%;
bottom:-10px;
width:20px;
height:20px;
z-index:1;
}
浏览 1提问于2014-05-14得票数 2
回答已采纳
这是其中一个“不可能”的CSS时刻...我想在视觉上增加元素的厚度。这很简单，我以前也这样做过，而且它是通过一个:after伪元素很好地实现的。这个伪元素有一个绝对位置。它的父对象有一个相对位置。一切都很好，除了伪元素没有显示，可能是由于z索引问题。所以我对伪元素设置了负的z索引，对父元素设置了0的z索引，是的，它是有效的…但内容显示在其父对象的文本下，而不是背景下。这怎么可能?！
你可以在这里检查它:在页面的末尾，有一个紫色的按钮“合并并发布”，应该有一个厚度。使用"a“元素的z索引，您就会明白我的意思。
工作示例：
HTML
<a href="#" class
浏览 2提问于2015-05-29得票数 0
1回答
我试图为它的父元素后面的一个元素做z索引，但是它不起作用。
这是我的钢笔：
我的SCSS：
div {
width: 400px;
height: 250px;
position: relative;
background: grey;
margin: 100px auto;
z-index: 5;
&:after {
content: ":after";
position: absolute;
width: 100%;
height: 100%;
top: -20px;
right: -7
浏览 0提问于2014-12-19得票数 0
回答已采纳
3回答
我的问题是，当类是粘性的添加到我的菜单，我的：：前和：：后的标志不再是必要的。我不是Jquery的最大英雄，也不能用在线搜索来修复它。
迪夫
<div id='Top_bar' class='is-sticky'>
<div class='container>
<div class='top_bar_left>
::before
<div class='logo>
::after
</div>
</div>
</div>
浏览 11提问于2021-03-17得票数 0
回答已采纳
我正在尝试修改一个伪元素:before的"left“属性。使用JavaScript或jQuery修改任何其他元素都没有问题，但在尝试修改:before选项卡中的元素时似乎遇到了问题。
举个例子，我似乎不能将下面:before元素的left属性设置为200。
我的css：
#buttonBox {
position: absolute;
width:150px;
z-index:10;
left:298px;
top: 130px;
}
#buttonBox:before {
position: absolute;
content
浏览 0提问于2011-11-29得票数 2
1回答
总之，我的项目是制作酷的动画标题外观，有一个彩色块从一边来，而扩大和消失，从另一边，同时收缩，让文字出现。
我的目标是实现一些简单的东西，只要给它们正确的类，就可以很容易地在不同的元素上使用。
我只使用CSS的动画，以改善加载时间。
我绝对希望动画能够自动适应它包含的文本的大小。
我遇到的问题：
宽度动画从左到右很容易，但从右到左是不容易的，因为CSS‘动画’中没有原始定义(就像‘transform’中那样)来解决我使用两个元素的问题：
第一个位置为absolute, left:0
第二个位置为absolute, right:0
每个人只制作动画的一部分。我觉得用两个元素来假装只有一个元素的动
浏览 0提问于2016-10-26得票数 3
回答已采纳
1回答
我理解CSS转换不会影响元素的有效大小，只会影响元素的可视化表示。以下帖子讨论了这一点：
我还看到以下没有讨论溢出距离的讨论：
我试图包装一个元素，该元素已被缩放到另一个元素中，溢出设置为滚动。
问题是，由于CSS缩放不会影响元素的实际大小，因此只会将其可视化表示设置为元素的原始维度，该维度要么太大，要么太小。
是否存在显式设置父级溢出距离以解决此问题的方法？这可能允许我在父服务器上将溢出高度设置为child height * scale，将宽度设置为child width * scale。
我期望通过用户输入来改变实际的缩放值，动态地调整元素的大小。
浏览 0提问于2019-06-25得票数 0
回答已采纳
1回答
我正在建立一个固定背景图像的网站。这将是完美的，它是灰阶和模糊。
因为我自己发现filter: blur(100%)会模糊整个页面及其内容，所以我了解到我可以在:before中设置过滤器。
这是我的SCSS：
.front-layout {
font-family: 'Fira-Mono', 'monospace';
min-height: 100vh;
background: #0e0e0e fixed;
background-size: cover;
filter: grayscale(100%); <-- I somehow ne
浏览 1提问于2018-11-07得票数 0
回答已采纳
我不能正确地使用行话来找出如何做到这一点。在我的页面上，有许多带有"z-title“类的span元素。我想向这些元素添加一个额外的类，它包括一个递增的数字，例如
从这里开始
<span class="z-title">Hello</span>
<span class="z-title">Hello</span>
<span class="z-title">Hello</span>
到这个
<span class="z-title tab1">
浏览 0提问于2017-07-26得票数 0
回答已采纳
1回答
伪元素(如::before或::after )中的内容实际上不存在于DOM树中。所以，用选择器定位是不可能的。
问题是，我怎样才能提取其中的内容？例如：
<div>This is <span></span>n apple.</div>
...
span::before {
content : "a"
}
shows : This is an apple.
但是，如果我提取div的文本，我只会得到没有span::before内容的This is n apple.。
我该如何处理这个问题？
浏览 3提问于2017-04-05得票数 3
3回答
这是一个有点老生常谈的问题，但也许值得一问。在CSS中，伪类和伪选择器有机械上的区别吗？我们在这里互换使用这个术语，但似乎这两个术语是有原因的。区分这两者有什么用吗？
浏览 0提问于2010-06-24得票数 7
回答已采纳
3回答
Z-边界索引
、、
我一直在寻找一种向边框添加z索引的方法，但似乎找不到，所以我想在这里问一问。
比方说我有一个家长的孩子。父服务器有一个边框，我希望该边框与子div重叠，但我不希望父边界与其重叠。
浏览 0提问于2015-03-06得票数 27
2回答
我想知道是否有人能告诉我为什么我的z-index属性不能正常工作。
两侧的横幅(黑色)的z索引为：
z-index: -1;
和黄色的横幅：
z-index: 1000;
这是一个类似于我正在使用的小提琴，两个黑色正方形的z指数低于黄色横幅，那么为什么它们显示在顶部？
两个灰色三角形似乎工作正常，我正在尝试创建横幅效果。
我试着改变了值，但是我似乎不能让它工作，我看过的所有其他地方都说它应该可以工作，所有的元素都有一个'position‘属性，所以我看不到问题。
有没有人？
浏览 3提问于2012-10-19得票数 1
回答已采纳
2回答
图示:如何在菜单背景后面显示徽标轮廓(徽标的子项)？
徽标是居中菜单的一部分，但不一定在中间(取决于菜单项名称)，所以对我来说，最好的解决方案是在徽标div内保持轮廓，如下所示：
<img src="background-image.jpg">
<div class="menu">
<ul>
<li>Menu 1</li>
<li>Menu 2</li>
<li>
<div class="logo">
浏览 0提问于2018-01-25得票数 2
我想要类似jquery的选择器，但使用的是纯:last。
如果我不知道DOM结构中的索引，怎么能只得到'z‘段落，！。或者怎么得到最后一个班级的孩子“..area”我看到了这个，但是它在我的例子中不起作用，因为我在父元素中有另一个孩子。
p.area:last-child不工作！
当我们知道.area类中有多少元素时，我找到了一个解决方案。
选择器看起来是这样的：p.area ~ p.area ~ p.area，但是当我们不知道.我想..。只是为了好玩
<div>
<h1>This is a heading</h1>
<p class=
浏览 3提问于2013-08-15得票数 5
1回答
我正在尝试用纯css设置组合框的样式，并找到一些教程，创建了组合box.It在chrome和火狐上工作得很好。
请看一下我创建的样式。
label
{
position:relative;
z-index:9999;
}
label:after
{
content:'?';
font:11px "Consolas", monospace;
color:#009FDF;
font-size:120%;
pointer-events:none;
background: #fff;
bor
浏览 1提问于2013-02-28得票数 1
5回答
我有一个很好的纯CSS。我已经在这个中实现了它。看上去都很漂亮！
但是，在我的情况下，我也有一个css的div，如下所示：
div {
position: absolute;
bottom: 0;
left: 0;
right: 0;
top: 0;
background-color: green;
}
这个div在适当的位置，css效果使用后-它是混乱的。这似乎是z-index的一个问题！然而，我已经摆弄了z-indexes，但我无法修复它。签出这个显示问题的。有什么可以解决的问题吗？
浏览 3提问于2014-03-19得票数 1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
