<p>표시 값에는 블록, 인라인, 없음, 인라인 블록, 플렉스, 그리드, 테이블, 인라인 테이블 및 목록 항목 등이 포함됩니다. 자세한 소개: 1. 요소를 블록 수준 요소로 렌더링하는 블록 블록 수준 요소는 페이지에서 블록을 형성하고 한 줄만 차지합니다. 2. 요소를 인라인 요소로 렌더링하는 인라인. 인라인 요소는 그 자체로 한 줄을 차지하지 않으며 다른 요소와 나란히 있을 수 있습니다. 3. 없음, 이 값은 요소가 페이지에 표시되지 않음을 지정합니다.<p> <p>이 튜토리얼의 운영 체제: Windows 10 시스템, DELL G3 컴퓨터.
CSS에서 display
속성은 요소의 표시 유형을 결정하는 데 사용됩니다. 다양한 값을 가질 수 있으며 주요 값은 다음과 같습니다. none; 글꼴 계열: SFMono-Regular, Consolas, "Liberation Mono", Menlo, Courier, monospace; 탭 크기: 4; 배경색: rgba(27, 31 , 35, 0.05); 테두리 반경: 3px;">표시 속성 값: display
属性用于确定元素的显示类型。它可以有多种不同的值,以下是一些主要的display
属性值:
<div>
、<p>
、<h1>
-<h6>
以及<li>
1. block: 요소를 블록 수준 요소로 렌더링합니다. 블록 수준 요소는 페이지에서 블록을 형성하고 자체 줄을 차지합니다. 예를 들어 <div>
, <p>
, <h1>
-<h6>
및 <li>
등 모두 기본 블록 수준 요소입니다. 🎜<p>2. inline: 요소를 인라인 요소로 렌더링합니다. 인라인 요소는 그 자체로 한 줄을 차지하지 않으며 다른 요소와 함께 배치될 수 있습니다. 예를 들어 <span>
, <a>
등은 모두 기본 인라인 요소입니다. <span>
、<a>
等都是默认的内联元素。
<p>3、none:此值指定元素不会在页面上显示。它与visibility: hidden
不同,因为使用visibility: hidden
的元素仍然会占据页面空间,而使用display: none
<p>3.none: 이 값은 요소가 페이지에 표시되지 않도록 지정합니다. 가시성: 숨겨진
은 visibility: Hidden
요소는 여전히 페이지 공간을 차지하고 display: none
요소가 레이아웃에서 완전히 제거됩니다.
<p>4. inline-block: 요소를 인라인 블록 수준 요소로 렌더링합니다. 인라인 블록 수준 요소의 특징은 인라인 요소처럼 나란히 배치되지만 너비와 높이를 설정할 수 있고 블록 수준 요소처럼 자체 크기를 가질 수 있다는 것입니다. 🎜5. flex🎜: 요소를 유연한 상자 모델로 렌더링합니다. Flexbox 모델은 1차원 공간(행 또는 열) 내에서 공간을 배치하고, 정렬하고, 배포하기 위한 CSS 레이아웃 기술입니다. 🎜<p>6. 그리드: 요소를 그리드 컨테이너로 렌더링합니다. 그리드 컨테이너는 두 차원(행과 열) 내에서 공간을 배치하고 정렬하고 배포합니다.
<p>7. table: 요소를 테이블로 렌더링합니다. 이 값은 주로 표 형식의 데이터를 표시하는 데 사용되었지만 최신 CSS 기술이 보다 유연한 레이아웃 방법을 제공하므로 더 이상 일반적으로 사용되지 않습니다.
<p>8. inline-table: 요소를 인라인 테이블로 렌더링합니다. 인라인 테이블은 인라인 블록 수준 요소와 유사하지만 셀 사이의 여백 및 패딩과 같은 테이블의 특성을 갖습니다.
<p>9. list-item: 요소를 목록 항목으로 렌더링합니다. 이 값을 사용하면 요소가 기본 글머리 기호 또는 번호 매기기와 함께 목록의 항목으로 나타납니다.
위의 주요 display
属性值,还有一些其他的取值,如 run-in
、compact
、marker
etc 외에도 현대 웹 개발에서는 이러한 값을 사용하는 것이 일반적이지 않습니다. 대부분의 경우 위에서 언급한 주요 값을 사용하면 대부분의 레이아웃 요구 사항을 충족할 수 있습니다.
위 내용은 디스플레이에는 어떤 가치가 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!