>  기사  >  웹 프론트엔드  >  인라인 요소의 특징은 무엇입니까?

인라인 요소의 특징은 무엇입니까?

hzc
hzc원래의
2020-06-24 16:59:314092검색

인라인 요소의 특징은 다음과 같습니다. 1. 가로 방향에 따라 순서대로 레이아웃됩니다. 2. 요소 앞뒤에 줄 바꿈이 없습니다. 3. 공백으로 제어됩니다. 수직 방향은 효율적이지만 수평 방향으로는 효율적이지 않습니다.

인라인 요소의 특징은 무엇입니까?

저 같은 초보자의 경우 처음에는 블록 요소와 인라인의 차이점, 차이점을 구분하지 못하는 경우가 많습니다.

그러나 블록 요소는 비교적 이해하기 쉽지만, 인라인 요소의 경우 주의해야 할 사항이 있습니다.

인라인 요소의 특징:

  • 가로 방향에 따라 순서대로 레이아웃됩니다.

  • 공백으로 제어되는

  • 요소 앞과 뒤를 줄 바꿈하지 않습니다.

  • margin/padding은 세로 방향에서는 유효하지 않고 가로 방향에서는 유효합니다.

  • width/height 속성은 대체되지 않은 인라인 요소에 유효하지 않으며 너비는 요소 콘텐츠에 따라 결정됩니다.

  • 대체되지 않은 인라인 요소의 라인 상자 높이는 line-height에 의해 결정되고, 교체된 인라인 요소의 라인 상자 높이는 높이, 여백, 패딩 및 테두리에 의해 결정됩니다.

  • vertical-align 속성이 적용됩니다.

인라인 요소에는 위의 기능 외에도 또 다른 중요한 기능이 있습니다.

플로팅(float) 또는 절대 위치 지정(위치: 절대) 시 블록으로 변환됩니다

<body>
    <p>HTML 不是一种编程语言,而是一种标记语言</p>
    <p>我的第一个段落。<a href="http://www.runoob.com/">链接</a>这是段落末尾</p>
    <p>HTML 文档包含了HTML 标签及文本内容.HTML 使用标记标签来描述网页</p>
</body>
<style>
    a{background:red; height:50px; width:50px;}
</style>

인라인 요소의 특징은 무엇입니까?

추천 튜토리얼: "css 튜토리얼"

위 내용은 인라인 요소의 특징은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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