A 태그에서 너비와 높이 설정


131

앵커 태그에서 너비와 높이를 픽셀 단위로 설정할 수 있습니까? 앵커 안에 텍스트를 유지하면서 배경 이미지를 갖도록 앵커 태그를 갖고 싶습니다.

li {
  width: 32px;
  height: 32px;
  background-color: orange;
}

li a {
  width: 32px;
  height: 32px;
  background-color: red;
}
<li><a href="#">Something</a></li>

답변:


288

당신은 당신의 앵커 만들 필요가 display: block또는 display: inline-block;다음은 폭과 높이 값을 허용합니다.


66

을 사용할 수도 있습니다 display: inline-block. 이것의 장점은 블록 요소처럼 높이와 너비를 설정하지만 인라인으로 설정하여 다른 태그를 바로 옆에 배치하여 부모 공간을 허용한다는 것입니다.

디스플레이 속성 에 대한 자세한 내용은 여기를 참조하십시오.


앵커 태그의 너비를 특정 너비와 높이가 아닌 텍스트 내용으로 설정하는 솔루션을 찾고 있었으므로 "인라인 블록"으로 설정하면 트릭이 정확하게 이루어졌습니다. 감사.
TheCuBeMan

7

앵커를 UL 목록에 넣지 않으면 이러한 모든 제안이 작동합니다.

<ul>
    <li>
        <a>click me</a>>
    </li>
</ul>

그런 다음 모든 계단식 스타일 시트 규칙이 Chrome 브라우저에서 재정의됩니다. 너비가 자동이됩니다. 그런 다음 앵커 자체에서 직접 인라인 CSS 규칙을 사용해야합니다.



당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.