Html 删除一个负边距并用其他值替换

如何删除此负边距并替换它

有哪些方法可以做到这一点

单击图像上的以查看链接

您必须单击图像上的以查看链接

一种方法是使用：

.link div {
  margin: 0 0 12px 0;
  font-size: 0; /* Remove whitespace created by inline-block */
}

.link a:first-child {
    margin-left: 0px;
}

.link a {
    width: 50px;
    height: 50px;
    margin: 0px;
    background: black;
    box-Shadow: inset 0 0 0 3px #0059dd;
    display: inline-block;
    margin-left: 4px;
}

显示：flex


还有其他方法吗？

这是否可以“不”使用flex来完成？
将
显示：flex添加到
。link div
：

.link div {
    margin: 0 0 12px 0;
    display: flex;
 }

从
中删除
边距：-50px 0
。链接a
：

.link a {
    width: 50px;
    height: 50px;
    background: black;
    box-Shadow: inset 0 0 0 3px #0059dd;
}

.link a {
    width: 50px;
    height: 50px;
    background: black;
    box-Shadow: inset 0 0 0 3px #0059dd;
    display: inline-block;
}

更换以下块：

a.x1 {
    margin: 0;
}

a.x2 {
    margin-left: 54px;
}

a.x3 {
    margin-left: 108px;
}

a.x4 {
    margin-left: 162px;
}

a.x5 {
    margin-left: 216px;
}

借

更新


编辑（不带flexbox）：

为
.link div
指定一个固定的
高度
（这是避免最后一次div后出现额外空间所必需的）：

将
显示：内联块添加到
。链接a
：

.link a {
    width: 50px;
    height: 50px;
    background: black;
    box-Shadow: inset 0 0 0 3px #0059dd;
}

.link a {
    width: 50px;
    height: 50px;
    background: black;
    box-Shadow: inset 0 0 0 3px #0059dd;
    display: inline-block;
}

删除所有
a.x*
选择器

调整后的样式：

.link div {
  margin: 0 0 12px 0;
  font-size: 0; /* Remove whitespace created by inline-block */
}

.link a:first-child {
    margin-left: 0px;
}

.link a {
    width: 50px;
    height: 50px;
    margin: 0px;
    background: black;
    box-Shadow: inset 0 0 0 3px #0059dd;
    display: inline-block;
    margin-left: 4px;
}

摘要：

.link div {
  margin: 0 0 12px 0;
  font-size: 0; /* Remove whitespace created by inline-block */
}

.link a:first-child {
    margin-left: 0px;
}

.link a {
    width: 50px;
    height: 50px;
    margin: 0px;
    background: black;
    box-Shadow: inset 0 0 0 3px #0059dd;
    display: inline-block;
    margin-left: 4px;
}

重置
margin
属性值并将其显示为
内联块
删除单个锚链
左边距
样式

在第二行添加一个附加的锚链元素（
.x3
）
代码片段演示：

.link div {
  margin: 0 0 12px 0;
  font-size: 0; /* Remove whitespace created by inline-block */
}

.link a:first-child {
    margin-left: 0px;
}

.link a {
    width: 50px;
    height: 50px;
    margin: 0px;
    background: black;
    box-Shadow: inset 0 0 0 3px #0059dd;
    display: inline-block;
    margin-left: 4px;
}


（函数iife（）{
“严格使用”；
document.querySelector（“.myLink”）.classList.add（“hide”）；
函数playButtonClickHandler（）{
document.querySelector（“.myLink”）.classList.remove（“hide”）；
var按钮=document.querySelector（“.playButton”）；
var player=document.querySelector（“#player”）；
document.querySelector（“.playButton.initial”）.style.display=“无”；
player.volume=1.0；
如果（播放器暂停）{
按钮。类列表。添加（“播放”）；
document.querySelector（“.playButton.play”）.style.display=“无”；
document.querySelector（“.playButton.pause”）.style.display=“内联块”；
player.play（）；
}否则{
document.querySelector（“.playButton.play”）.style.display=“内联块”；
document.querySelector（“.playButton.pause”）.style.display=“无”；
player.pause（）；
}
}
var playButton=document.querySelector（“.playButton”）；
playButton.addEventListener（“单击”，playButtonClickHandler）；
}());
.wrap{
位置：相对位置；
显示：表格；
背景：红色；
}
.首字母{
宽度：260px；
高度：168px；
光标：指针；
背景图像：线性渐变（向右，透明，透明83px，#0059dd 83px，#0059dd 86px，透明86px，透明174px，#0059dd 174px，#0059dd 177px，透明177px，透明260px），url（“https://i.imgur.com/BBYxKcf.jpg");
边框：3px实心#0059dd；
字体系列：Tahoma；
字体大小：粗体；
字体大小：30px；
颜色：#0059dd；
光标：指针；
线高：100px；
文本对齐：居中；
}
.播放按钮{
位置：绝对位置；
左：0；
排名：0；
右：0；
底部：0；
保证金：自动；
宽度：50px；
高度：50px；
光标：指针；
背景色：#000000；
盒影：插入0 3px#0059dd；
填充：#aaff00；
}
.联络组{
边际：0.12像素0；
字体大小：0；/*删除内联块创建的空白*/
}
链接a：第一个孩子{
左边距：0px；
}
.链接a{
宽度：50px；
高度：50px；
边际：0px；
背景：黑色；
盒影：插入0 3px#0059dd；
显示：内联块；
左边距：4倍；
}
/*a、 x1{
保证金：0；
}
a、 x2{
左边距：54px；
}
a、 x3{
左边距：108px；
}
a、 x4{
左边距：162px；
}
a、 x5{
左边距：216px；
}*/
.藏，.玩{
显示：无；
}
.link div：最后一个孩子{
页边距底部：0；
}

链接
您的问题很不清楚。你贴的小提琴怎么了？我不明白有什么问题。。。你不能修改CSS吗？如果您想删除负边距并替换它，只需编辑CSS文件并替换
-50px
以获得所需的任何值…我将用什么值替换它？我只是用小提琴将其删除，结果是相同的。你为什么不把它拿走？那不行。之后点击图片。这是一种方法。这是否可以在“不”使用flex的情况下实现？确实如此。我将用第二个提琴更新我的答案，它需要在两个水平空格之间为12px。您看到的是内联块元素创建的空白。答案已经更新，以纠正这一点-你应该注意到添加的样式，但我很乐意解释任何事情。这还不清楚