Мне надо оставить список, то есть работать с тегом li.
Возможно ли сделать эллемент списка кликабельный без добавления тега
<a></a> ?
<!DOCTYPE html>
<html>
<head>
<style>
a:link, a:visited {
text-decoration: none;
display: inline-block;
background-color: white;
border: none;
padding: 0px 12px;
width: 12em;
color: black;
}
a:hover, a:active {
background-color: #edebeb;
}
</style>
</head>
<body>
<ul>
<li><a href="#">спискок кликабельный</a></li>
</ul>
</body>
</html>
тег blazor добавила, потому что веб проект блазор, c#, возможно есть событие, которое можно приписать к списку, или еще что то мне незнакомое
Ответы (2 шт):
Автор решения: Dev18
→ Ссылка
.listdetail-item {
background-color: white;
border: none;
padding: 0px 12px;
width: 12em;
cursor: pointer;
}
.listdetail-item:hover,
listdetail-item:active {
background-color: #edebeb;
}<!DOCTYPE html>
<html>
<head>
</head>
<body>
<ul>
<li onclick="location.href = '#'" class="listdetail-item"> спискок кликабельный </li>
</ul>
</body>
</html>
Автор решения: Михаил Камахин
→ Ссылка
Или так
*, *::before, *::after {
box-sizing: border-box;
margin: 0;
padding: 0;
}
a {
}
.list__container {
display: flex;
flex-direction: column;
align-items: flex-start;
}
.list__container > *::before {
content: '•';
display: inline-block;
position: static;
color: black;
margin-right: 4px;
}
.list__container > * + * {
margin-top: 10px;
}<div class="list__container">
<a href="/путь" class="list__link">/путь</a>
<a href="/путь" class="list__link">/путь</a>
<a href="/путь" class="list__link">/путь</a>
</div>