css display属性怎么用

silencement

发布时间：2019-05-26 16:45:49

4205人浏览过

来源于php中文网

原创

css display属性怎么用

display属性定义及用法

display属性在网页布局中用的非常之多，它的属性值也比较多，但是用的多的就block、inline-block、inline和none属性值，其它属性值很少见，所有在这就重点介绍一下常用的这几个属性值的用法；

在css中，display属性是用来定义元素应该生成的框的类型，经常用来将块状元素转换为内联元素、将内联元素转换为块状元素或者将块状元素/内联元素转换为inline-block元素，inline-block元素既有块状元素的特性已有内联元素的特性。

display属性语法格式

立即学习“前端免费学习笔记（深入）”；

1.css语法：display:none/inline/block/inline-block/list-item/run-in/table/inline-table/table-row-group/table-header-group/table-footer-group/table-row/table-colume-group/table-column/table-cell/table-caption/inherit

2.JavaScript 语法： object.style.display="inline"

display属性值说明

none：设置元素不显示

block：设置元素为块级元素

inline：设置元素为内联元素

inline-block：行内块元素，既有块状元素的特性已有内联元素的特性

Dompdf

dompdf是一个HTML到PDF转换器。在其核心，dompdf是一个（大部分）符合CSS 2.1标准的HTML布局和渲染引擎，使用PHP编写。它是一个以样式驱动的渲染器，它会下载并读取外部样式表，内联样式标签和单个HTML元素的样式属性。它还支持大多数表现性HTML属性。PDF渲染目前由PDFLib或由Wayne Munro编写的捆绑版本的R&OS CPDF类提供。（对R&OS类进行了一些重要的更改，但是）。为了使用dompdf与PDFLib，需要安装PDFLib PECL扩展。使用PD

下载

list-item：设置元素为列表

run-in：根据上下文作为块级元素或内联元素显示

compact / marker：已经从CSS2.1中删除

table：设置元素为块级表格来（类似

），表格前后有换行符

inline-table：设置元素为内联表格（类似

），表格前后没有换行符

table-row-group：设置元素为一个或多个行的分组（类似

）

table-header-group ：类似

标签

table-footer-group：类似

标签;table-row ：类似标签

display属性的none属性值

元素的display属性的属性值设置为none时，该元素将隐藏不显示，而其会脱离文档流，不占据网页空间；非常相关：css隐藏元素之display和visibility属性的用法笔记

实例





display属性的none属性值



元素1
元素2
元素3

css文本颜色渐变过渡失败怎么办_结合transition color和hover状态使用

多模块响应式切换卡顿怎么办_通过grid自动重排区域

css元素颜色动画与过渡冲突怎么办_合理分配transition和animation属性

css动画执行一次就停止怎么办_设置animation iteration count

csshover下伪元素动画不生效怎么办_使用transition或animation控制伪元素属性

本站声明：本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn

上一篇：css font属性怎么用下一篇：css transform-origin属性怎么用

作者最新文章

TP6验证码验证失败的原因以及解决办法

2020-01-26 22:16

PHP7.4新特性汇总

2020-01-26 22:25

mysql正则匹配模糊查询某个字段

2020-01-27 21:18

PHP中字符串处理的一些常用函数

2020-01-27 21:32

PHP中的global关键字用法

2020-01-27 21:42

PHP中Trait的用法及示例

2020-01-29 22:21

php中常用的正则表达式使用方法

2020-01-30 22:30

ThinkPHP5.1中使用redis缓存

2020-01-30 22:43

ThinkPHP5中的事务操作

2020-01-30 22:49

如何设置cookie和删除cookie

2020-02-27 16:50

热门AI工具

DeepSeek

幻方量化公司旗下的开源大模型平台

AI大模型

开放平台

豆包大模型

字节跳动自主研发的一系列大型语言模型

AI大模型

通义千问

阿里巴巴推出的全能AI助手

AI大模型

腾讯元宝

腾讯混元平台推出的AI助手

文档处理

Excel 表格

文心一言

文心一言是百度开发的AI聊天机器人，通过对话可以生成各种形式的内容。

AI大模型

中文写作

讯飞写作

基于讯飞星火大模型的AI写作工具，可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

中文写作

写作工具

即梦AI

一站式AI创作平台，免费AI图片和视频生成。

图片拼接

图画生成

ChatGPT

最最强大的AI聊天机器人程序，ChatGPT不单是聊天机器人，还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

AI大模型

中文写作

智谱清言 - 免费全能的AI助手

AI大模型

PDF 文档

相关专题

苹果官网入口直接访问

苹果官网直接访问入口是https://www.apple.com/cn/，该页面具备0.8秒首屏渲染、HTTP/3与Brotli加速、WebP+AVIF双格式图片、免登录浏览全参数等特性。本专题为大家提供相关的文章、下载、课程内容，供大家免费下载体验。

115

2025.12.24

拼豆图纸在线生成器

拼豆图纸生成器有PixelBeads在线版、BeadGen和“豆图快转”；推荐通过pixelbeads.online或搜索“beadgen free online”直达官网，避开需注册的诱导页面。本专题为大家提供相关的文章、下载、课程内容，供大家免费下载体验。

2025.12.24

俄罗斯搜索引擎yandex官方入口地址（最新版）

Yandex官方入口网址是https://yandex.com。用户可通过网页端直连或移动端浏览器直接访问，无需登录即可使用搜索、图片、新闻、地图等全部基础功能，并支持多语种检索与静态资源精准筛选。本专题为大家提供相关的文章、下载、课程内容，供大家免费下载体验。

546

2025.12.24

JavaScript ES6新特性

ES6是JavaScript的根本性升级，引入let/const实现块级作用域、箭头函数解决this绑定问题、解构赋值与模板字符串简化数据处理、对象简写与模块化提升代码可读性与组织性。本专题为大家提供相关的文章、下载、课程内容，供大家免费下载体验。

150

2025.12.24

php框架基础知识汇总

php框架是构建web应用程序的架构，提供工具和功能，以简化开发过程。选择合适的框架取决于项目需求和技能水平。实战案例展示了使用laravel构建博客的步骤，包括安装、创建模型、定义路由、编写控制器和呈现视图。本专题为大家提供相关的文章、下载、课程内容，供大家免费下载体验。

2025.12.24

Word 字间距调整方法汇总

本专题整合了Word字间距调整方法，阅读下面的文章了解更详细操作。

2025.12.24

任务管理器教程

本专题整合了任务管理器相关教程，阅读下面的文章了解更多详细操作。

2025.12.24

AppleID格式

本专题整合了AppleID相关内容，阅读专题下面的文章了解更多详细教程。

2025.12.24

csgo视频观看入口合集

本专题整合了csgo观看入口合集，阅读下面的文章了知道更多入口地址。

371

2025.12.24

热门下载

网站特效

网站源码

网站素材

前端模板