[英]LESS hide first element with class in DIV
I'm currently trying to hide a button using LESS. 我目前正在尝试使用LESS隐藏按钮。 My HTML looks the following way: 我的HTML看起来是这样的:
<div class="targets">
<div class="target">
<div class="form-group">
<div class="col-md-12">
<button type="button" class="btn-delete" />
</div>
</div>
</div>
</div>
The problem: I use jQuery to add a "target" div to "targets" div, the html looks like this after the DOM manipulation: 问题:我使用jQuery将“目标” div添加到“目标” div,经过DOM操作后,html如下所示:
<div class="targets">
<div class="target">
<div class="form-group">
<div class="col-md-12">
<button type="button" class="btn-delete" />
</div>
</div>
</div>
<div class="target">
<div class="form-group">
<div class="col-md-12">
<button type="button" class="btn-delete" />
</div>
</div>
</div>
<div class="target">
<div class="form-group">
<div class="col-md-12">
<button type="button" class="btn-delete" />
</div>
</div>
</div>
</div>
I always want to hide the first button with the class btn-delete. 我一直想用btn-delete类隐藏第一个按钮 。 I use LESS. 我用LESS。
My current LESS looks like this: 我当前的LESS看起来像这样:
.targets {
button[type="button"] {
.btn-delete {
visibility: hidden;
}
}
}
Unfortunately my LESS coding doesn't work as I expected. 不幸的是,我的LESS编码无法正常工作。
Do you know how to solve this issue, thus to always hide the first .btn-delete button with LESS Css? 您知道如何解决此问题,从而始终用LESS Cs隐藏第一个.btn-delete按钮吗?
Thanks! 谢谢! :) :)
As you are targeting the button with btn-delete
class, You need &
operator 当您使用btn-delete
类定位按钮时,您需要&
运算符
.targets {
button[type="button"] {
&.btn-delete {
visibility: hidden;
}
}
}
OR , Traditional way 或 ,传统方式
.targets {
button[type="button"].btn-delete {
visibility: hidden;
}
}
Its applying the visibility to a element with a class inside the button so 它将可见性应用于按钮内具有类的元素,因此
.targets {
button[type="button"].btn-delete {
visibility: hidden;
}
}
Would look for button[type="button"] with the class .btn-delete. 将使用类.btn-delete寻找button [type =“ button”]。
Hello use below code it work properly 你好使用下面的代码它可以正常工作
.targets{
.target:first-child{
button[type="button"] {
&.btn-delete{
visibility: hidden;
}
}
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.