찾다
웹 프론트엔드CSS 튜토리얼CSS의 표시 속성에 대한 자세한 소개

CSS display Property

@

모든 주요 브라우저는 디스플레이 속성을 지원합니다.

Note: !DOCTYPE이 지정되면 Internet Explorer 8(이상)은 "inline-table", "run-in", "table", " 테이블 캡션", "테이블 셀", "테이블 열", "테이블 열 그룹", "테이블 행", "테이블 행 그룹" 및 "상속".

정의 및 사용법

display 속성은 요소가 생성해야 하는 상자 유형을 지정합니다.

Description

이 속성은 레이아웃 생성 시 요소에 의해 생성되는 표시 상자 유형을 정의하는 데 사용됩니다. HTML과 같은 문서 유형의 경우 표시를 부주의하게 사용하면 HTML에 이미 정의된 표시 계층 구조를 위반할 수 있으므로 위험할 수 있습니다. XML의 경우 XML에는 이러한 종류의 계층 구조가 내장되어 있지 않으므로 모든 표시가 절대적으로 필요합니다.

참고: compact 값과 marker는 CSS2에 있었지만 광범위한 지원이 부족하여 CSS2.1에서는 제거되었습니다.

Inherit
기본값: 인라인
默认值: inline
继承性: no
版本: CSS1
JavaScript 语法: object.style.display="inline"
속성: 아니요 버전: CSS1 JavaScript

구문: object.style.display="inline"

描述
none 此元素不会被显示。
block 此元素将显示为块级元素,此元素前后会带有换行符。
inline 默认。此元素会被显示为内联元素,元素前后没有换行符。
inline-block 行内块元素。(CSS2.1 新增的值)
list-item 此元素会作为列表显示
run-in 此元素会根据上下文作为块级元素或内联元素显示。
compact CSS 中有值 compact,不过由于缺乏广泛支持,已经从 CSS2.1 中删除
marker CSS 中有值 marker,不过由于缺乏广泛支持,已经从 CSS2.1 中删除。
table 此元素会作为块级表格来显示(类似 ),表格前后带有换行符。 inline-table 此元素会作为内联表格来显示(类似 ),表格前后没有换行符。)。)。)。)。)。) table-row-group 此元素会作为一个或多个行的分组来显示(类似 table-header-group 此元素会作为一个或多个行的分组来显示(类似 table-footer-group 此元素会作为一个或多个行的分组来显示(类似 table-row 此元素会作为一个表格行显示(类似 table-column-group 此元素会作为一个或多个列的分组来显示(类似 table-column 此元素会作为一个单元格列显示(类似 table-cell 此元素会作为一个表格单元格显示(类似 和 ) table-caption 此元素会作为一个表格标题显示(类似 ) inherit 规定应该从父元素继承 display 属性的值。
가능한 값@&@ 설명
가치
없음 이 요소는 표시되지 않습니다.
차단 이 요소는 이 요소 앞과 뒤에 줄 바꿈이 있는 블록 수준 요소로 표시됩니다.
인라인 기본값. 이 요소는 요소 앞뒤에 줄 바꿈 없이 인라인 요소 @&@으로 표시됩니다.
인라인 블록 인라인 블록 요소. (CSS2.1 새 @&@ 값)
list@&@-item 이 요소는 list@&@으로 표시됩니다.
런인 이 요소는 상황에 따라 블록 수준 요소 또는 인라인 요소로 표시됩니다.
컴팩트 CSS에는 컴팩트 값이 있지만 폭넓은 지원이 부족하여 CSS2.1@&@ 삭제.
마커 값 표시자는 CSS에 있었지만 광범위한 지원 부족으로 인해 CSS2.1에서는 제거되었습니다.
테이블 이 요소는 (비슷하게) 블록 ​​수준 table@&@으로 표시됩니다. 개행 문자 앞과 뒤의 테이블입니다. 인라인 테이블 이 요소는 인라인 테이블( 과 유사)로 표시되며 테이블 앞이나 뒤에 줄 바꿈이 없습니다. ). ). ). ). ). ) 테이블-행-그룹 이 요소는 하나 이상의 행에서 group@&@으로 표시됩니다( 테이블-head@&@er-group 이 요소는 하나 이상의 행 그룹으로 표시됩니다(예: 테이블 바닥글 그룹 이 요소는 하나 이상의 행 그룹으로 표시됩니다(예: 테이블 행 이 요소는 테이블 행으로 표시됩니다( 테이블-열-그룹 이 요소는 하나 이상의 열 그룹으로 표시됩니다(예: 테이블-열 이 요소는 셀 열로 표시됩니다( 테이블 셀 이 요소는 테이블 셀로 표시됩니다( 그리고 ) 표 캡션 이 요소는 테이블 제목으로 표시됩니다( ) 상속하다 표시 속성의 값이 상위 요소에서 상속되어야 함을 지정합니다.

위 내용은 CSS의 표시 속성에 대한 자세한 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
利用CSS怎么创建渐变色边框?5种方法分享利用CSS怎么创建渐变色边框?5种方法分享Oct 13, 2021 am 10:19 AM

利用CSS怎么创建渐变色边框?下面本篇文章给大家分享CSS实现渐变色边框的5种方法,希望对大家有所帮助!

css ul标签怎么去掉圆点css ul标签怎么去掉圆点Apr 25, 2022 pm 05:55 PM

在css中,可用list-style-type属性来去掉ul的圆点标记,语法为“ul{list-style-type:none}”;list-style-type属性可设置列表项标记的类型,当值为“none”可不定义标记,也可去除已有标记。

css与xml的区别是什么css与xml的区别是什么Apr 24, 2022 am 11:21 AM

区别是:css是层叠样式表单,是将样式信息与网页内容分离的一种标记语言,主要用来设计网页的样式,还可以对网页各元素进行格式化;xml是可扩展标记语言,是一种数据存储语言,用于使用简单的标记描述数据,将文档分成许多部件并对这些部件加以标识。

css3怎么实现鼠标隐藏效果css3怎么实现鼠标隐藏效果Apr 27, 2022 pm 05:20 PM

在css中,可以利用cursor属性实现鼠标隐藏效果,该属性用于定义鼠标指针放在一个元素边界范围内时所用的光标形状,当属性值设置为none时,就可以实现鼠标隐藏效果,语法为“元素{cursor:none}”。

css怎么实现英文小写转为大写css怎么实现英文小写转为大写Apr 25, 2022 pm 06:35 PM

转换方法:1、给英文元素添加“text-transform: uppercase;”样式,可将所有的英文字母都变成大写;2、给英文元素添加“text-transform:capitalize;”样式,可将英文文本中每个单词的首字母变为大写。

rtl在css是什么意思rtl在css是什么意思Apr 24, 2022 am 11:07 AM

在css中,rtl是“right-to-left”的缩写,是从右往左的意思,指的是内联内容从右往左依次排布,是direction属性的一个属性值;该属性规定了文本的方向和书写方向,语法为“元素{direction:rtl}”。

css怎么设置i不是斜体css怎么设置i不是斜体Apr 20, 2022 am 10:36 AM

在css中,可以利用“font-style”属性设置i元素不是斜体样式,该属性用于指定文本的字体样式,当属性值设置为“normal”时,会显示元素的标准字体样式,语法为“i元素{font-style:normal}”。

怎么设置rotate在css3的旋转中心点怎么设置rotate在css3的旋转中心点Apr 24, 2022 am 10:50 AM

在css3中,可以用“transform-origin”属性设置rotate的旋转中心点,该属性可更改转换元素的位置,第一个参数设置x轴的旋转位置,第二个参数设置y轴旋转位置,语法为“transform-origin:x轴位置 y轴位置”。

See all articles

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

AI Hentai Generator

AI Hentai Generator

AI Hentai를 무료로 생성하십시오.

뜨거운 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

SublimeText3 Linux 새 버전

SublimeText3 Linux 새 버전

SublimeText3 Linux 최신 버전

SecList

SecList

SecLists는 최고의 보안 테스터의 동반자입니다. 보안 평가 시 자주 사용되는 다양한 유형의 목록을 한 곳에 모아 놓은 것입니다. SecLists는 보안 테스터에게 필요할 수 있는 모든 목록을 편리하게 제공하여 보안 테스트를 더욱 효율적이고 생산적으로 만드는 데 도움이 됩니다. 목록 유형에는 사용자 이름, 비밀번호, URL, 퍼징 페이로드, 민감한 데이터 패턴, 웹 셸 등이 포함됩니다. 테스터는 이 저장소를 새로운 테스트 시스템으로 간단히 가져올 수 있으며 필요한 모든 유형의 목록에 액세스할 수 있습니다.

WebStorm Mac 버전

WebStorm Mac 버전

유용한 JavaScript 개발 도구

SublimeText3 영어 버전

SublimeText3 영어 버전

권장 사항: Win 버전, 코드 프롬프트 지원!