>웹 프론트엔드 >CSS 튜토리얼 >앵커 태그를 목록 항목의 전체 너비에 걸쳐 만드는 방법은 무엇입니까?

앵커 태그를 목록 항목의 전체 너비에 걸쳐 만드는 방법은 무엇입니까?

Linda Hamilton
Linda Hamilton원래의
2024-10-29 05:43:31417검색

How to Make Anchor Tags Span the Full Width of List Items?

목록 항목의 전체 너비 앵커 태그

소개

탐색 메뉴를 디자인할 때 앵커 태그()를 원하는 것이 일반적입니다. 목록 항목의 전체 너비에 걸쳐 늘입니다(

  • ). 그러나 태그에 너비 속성을 설정하면 일반적으로 효과가 없습니다.

    해결책

    이 늘이기 효과를 얻으려면 앵커 태그의 표시 속성을 변경해야 합니다. 같은 인라인 요소는 너비를 설정할 수 없습니다. 대신, 블록 또는 인라인 블록 요소로 변환해야 합니다.

    <code class="css">a.wide {
        display: block;
    }</code>

    사용

    CSS 규칙이 정의되면 "wide" 클래스를 앵커 태그에 추가합니다.

  • 요소:
    <code class="html"><ul id="menu">
      <li><a class="wide" href="javascript:;">Home</a></li>
      <li><a class="wide" href="javascript:;">Test</a></li>
    </ul></code>

    참고

    • Internet Explorer 6에서는 인라인 요소의 너비를 설정할 수 있지만 이는 잘못된 CSS 구현 때문입니다.
  • 위 내용은 앵커 태그를 목록 항목의 전체 너비에 걸쳐 만드는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

    성명:
    본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.