Для обрезания кнопки и оставления только границы в HTML можно использовать несколько подходов. Вот два распространенных метода.
1. Использование ширины и высоты элемента:
Простой способ обрезать кнопку и оставить только границу состоит в том, чтобы задать ей фиксированную ширину и высоту, а также установить значение background-color в transparent. Вот пример кода:
<button style="width: 100px; height: 50px; background-color: transparent; border: 1px solid black;"></button>
В этом примере кнопка будет иметь ширину 100 пикселей, высоту 50 пикселей и черную границу толщиной 1 пиксель. Задавая значение background-color в transparent, мы делаем фон кнопки прозрачным, так что видим только границу.
2. Использование свойства outline:
Другой способ обрезать кнопку и оставить только границу - использовать свойство outline. Если применить outline к кнопке, то она будет рисовать границу вокруг своего контента, не затрагивая уплотнения или отступы. Вот пример кода:
<button style="width: 100px; height: 50px; background-color: #fff; outline: 1px solid black;"></button>
В этом примере кнопка также будет иметь ширину 100 пикселей и высоту 50 пикселей, но фон будет белым, а граница будет черной с толщиной 1 пиксель. Здесь мы указываем outline как 1px solid black, что означает, что мы хотим создать границу толщиной 1 пиксель и цвета черного вокруг кнопки.
Оба эти метода могут быть использованы для обрезания кнопки в HTML и оставления только границы. Выбор способа зависит от ваших предпочтений и требований проекта.