Невозможно удалить синее украшение текста ссылки с кнопки
У меня есть кнопка ссылки, но я не могу убрать синее украшение ссылки внутри моей кнопки обновления (class=updatebut)
Я пробовал много вещей, например, поместить !important в мой css файл, и это тоже не работает
Я также пробовал .box-table2 .updatebut a {}
но это тоже не работает
EDIT : Я ИСПОЛЬЗУЮ ФРЕЙМВОРК DJANGO. МОЖЕТ ЛИ ЭТО ВЫЗВАТЬ ПРОБЛЕМУ?
вот мой html файл. dashboard.html
body {
background-color: rgb(29, 26, 39);
background-image: linear-gradient(135deg, rgba(255, 102, 161, 0.15) 0%, rgba(29, 26, 39, 0.15) 35%);
color: white;
}
.box-table2 {
width: 900px;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
margin-top: 120px;
}
.table {
color: white;
}
.thead-color {
background-color: rgb(81, 45, 168);
}
.updatebut {
padding: 4px 20px;
border-radius: 4px;
color: white;
background-image: linear-gradient(to right, rgb(103, 58, 183), rgb(81, 45, 168));
border: none;
font-size: 15px;
margin-right: 20px;
}
.updatebut a {
text-decoration: none !important;
}
<div class="box-table2">
<table class="table">
<thead class="thead-color">
<tr>
<th scope="col">Account</th>
<th scope="col">Server</th>
<th scope="col">Telegram</th>
<th scope="col">Balance</th>
<th scope="col">Risk %</th>
<th scope="col">Actions</th>
</tr>
</thead>
<tbody>
{% for accounts in data %}
<tr>
<td>{{accounts.accountid}}</td>
<td>{{accounts.mt5server}}</td>
<td>{{accounts.telegramchannel}}</td>
<td>{{accounts.balance}}</td>
<td>{{accounts.riskpertrade}}</td>
<td><a href="{% url 'update-account' accounts.id %}" class="updatebut">Update</a><a href="{% url 'delete-account' accounts.id %}" class="deletebut">Delete</a></td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
Поскольку класс добавляется к <a>
, поэтому вы должны установить стиль непосредственно в .updatebut
или a.updatebut
вместо .updatebut a
Потому что, .updatebut a
означает <a>
под классом .updatebut
. Ваш a
не является дочерним элементом класса .updatebut
. Он обновляется сам по себе.
Ор,
Добавьте класс .updatebut
к <button>
вместо <a>
body {
background-color: rgb(29, 26, 39);
background-image: linear-gradient(135deg, rgba(255, 102, 161, 0.15) 0%, rgba(29, 26, 39, 0.15) 35%);
color: white;
}
.box-table2 {
width: 900px;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
margin-top: 120px;
}
.table {
color: white;
}
.thead-color {
background-color: rgb(81, 45, 168);
}
.updatebut {
padding: 4px 20px;
border-radius: 4px;
color: white;
background-image: linear-gradient(to right, rgb(103, 58, 183), rgb(81, 45, 168));
border: none;
font-size: 15px;
margin-right: 20px;
}
a.updatebut {
text-decoration: none !important;
}
<div class="box-table2">
<table class="table">
<thead class="thead-color">
<tr>
<th scope="col">Account</th>
<th scope="col">Server</th>
<th scope="col">Telegram</th>
<th scope="col">Balance</th>
<th scope="col">Risk %</th>
<th scope="col">Actions</th>
</tr>
</thead>
<tbody>
{% for accounts in data %}
<tr>
<td>{{accounts.accountid}}</td>
<td>{{accounts.mt5server}}</td>
<td>{{accounts.telegramchannel}}</td>
<td>{{accounts.balance}}</td>
<td>{{accounts.riskpertrade}}</td>
<td><a href="{% url 'update-account' accounts.id %}" class="updatebut">Update</a><a href="{% url 'delete-account' accounts.id %}" class="deletebut">Delete</a></td>
</tr>
{% endfor %}
</tbody>
</table>
</div>