Html 分隔符未显示为onhover效果

Html 分隔符未显示为onhover效果,html,css,divider,onhover,Html,Css,Divider,Onhover,我只是在尝试一个简单的修复。出于某种原因,我的分隔器没有出现在悬停状态?我怎样才能让它像其他文本一样显示出来?我有另一个例子,我如何让分隔符在其他页面上查看 就在写着“关于”的页眉下方 另外,我目前正在使用的是runningfish.net/finestc 你可以在“最近的销售”一节下面看到实时代码 我还是一个初出茅庐的程序员,所以如果我做的事情效率低下,或者可能做得更好,请指出!我想在编码方面做得更好。欢迎评论 谢谢 .grids{ 宽度:33.33%; 浮动:左; 显示:内联块; 位置:

我只是在尝试一个简单的修复。出于某种原因,我的分隔器没有出现在悬停状态?我怎样才能让它像其他文本一样显示出来?我有另一个例子,我如何让分隔符在其他页面上查看

就在写着“关于”的页眉下方

另外,我目前正在使用的是runningfish.net/finestc 你可以在“最近的销售”一节下面看到实时代码

我还是一个初出茅庐的程序员,所以如果我做的事情效率低下,或者可能做得更好,请指出!我想在编码方面做得更好。欢迎评论

谢谢

.grids{
宽度:33.33%;
浮动:左;
显示:内联块;
位置:相对位置;
}
.img{
显示:块;
高度:33.33vh;
宽度:100%;
}
.网格图像描述{
位置:绝对位置;
排名:0;
底部:0;
左:0;
右:0;
背景:rgba(0,0,0,0.6);
颜色:#fff;
可见性:隐藏;
不透明度:0;
显示器:flex;
弯曲方向:立柱;
对齐项目:居中;
证明内容:中心;
转换:不透明度.5s,可见性.5s;
}
.网格图像描述h2{
字体系列:playfairdisplay;
字体大小:1.7em;
颜色:#fff;
}
.grid图像描述p{
字体系列:playfairdisplay;
字号:1.0em;
颜色:#fff;
}
.网格图像描述hr{
边框顶部:1px;
边框颜色:#001532;
边框样式:实心;
盒影:2px1px15px#fff;
利润率:0.10px;
最大宽度:200px;
}
.grids:悬停.grid图像描述{
能见度:可见;
不透明度:1;
}
.网格说明{
过渡:.5s;
变换:translateY(1em);
}
.grids:悬停.grid图像描述{
变换:translateY(0);
}


添加一个
宽度

.grids{
宽度:33.33%;
浮动:左;
显示:内联块;
位置:相对位置;
}
.img{
显示:块;
高度:33.33vh;
宽度:100%;
}
.网格图像描述{
位置:绝对位置;
排名:0;
底部:0;
左:0;
右:0;
背景:rgba(0,0,0,0.6);
颜色:#fff;
可见性:隐藏;
不透明度:0;
显示器:flex;
弯曲方向:立柱;
对齐项目:居中;
证明内容:中心;
转换:不透明度.5s,可见性.5s;
}
.网格图像描述h2{
字体系列:playfairdisplay;
字体大小:1.7em;
颜色:#fff;
}
.grid图像描述p{
字体系列:playfairdisplay;
字号:1.0em;
颜色:#fff;
}
.网格图像描述hr{
边框顶部:1px;
边框颜色:#001532;
边框样式:实心;
盒影:2px1px15px#fff;
利润率:0.10px;
最大宽度:200px;
/*增加*/
宽度:200px;
}
.grids:悬停.grid图像描述{
能见度:可见;
不透明度:1;
}
.网格说明{
过渡:.5s;
变换:translateY(1em);
}
.grids:悬停.grid图像描述{
变换:translateY(0);
}

您的

标签可能没有显示,因为它位于可见区域之外,很像主文本。哈哈哇。令人惊讶的是,仅仅一行代码就能让一切变得不同。你太棒了!在你看来,我的其余代码看起来专业吗?嗯,在图像上设置这样的高度会改变纵横比。最好使用高度:自动