美文网首页
CSS display

CSS display

作者: nic519 | 来源:发表于2018-09-26 17:14 被阅读0次

display:none

表示此元素将不被显示

display:block

此元素将会被显示成块级元素,此元素前后会带有换行符。
块级元素:

  • 常见的块级元素有<div><p><h1><li>

display:inline

作用即可以将一个块级元素转换成行内元素,那么这个块级元素将不能再设置宽和高以及上下方向的margin和padding。
行内元素:

  • 不会单独占据一行,而是占领自身宽度和高度本身,高度一般由其字体决定。
  • 若干同级行内元素会从左往右,从上到下依次排列。
  • 只能设置margin和padding值的左右,而设置不了上下。
  • 常见的行内元素:<a><em><img>
  • 默认的display属性值默认为inline

display:inline-block

设置了inline-block属性的元素既具有block元素可以设置width和height属性的特性,又保持了inline元素不换行的特性。

display:flex

2009年,W3C提出了一种新的方案--Flex布局,可以简便、完整、响应式地实现各种页面布局。详情

相关文章

  • css display

    简介 display CSS属性指定用于元素的呈现框的类型。在 HTML 中,默认的 display 属性取决于 ...

  • CSS display

    display:none 表示此元素将不被显示 display:block 此元素将会被显示成块级元素,此元素前后...

  • CSS Display

    块级元素(block-level) 每个元素通常都会占用一行或多整行,可以设置宽度、高度、对齐等属性,常用语网页布...

  • CSS第二节

    CSS的标签模式设置Display属性 display可以控制标签的显示模式。 display:none | in...

  • css定位

    CSS position属性 CSS display属性 CSS float属性 (引用:https://www...

  • display属性的知识点+实例解读

    display属性在前端中大致分为html dom display属性和css display属性。本文主要讲解...

  • CSS3 display:flex和display:box有什么

    CSS3 display:flex和display:box有什么区别?display:box布局的详细介绍(图解)...

  • 关于css中display table的理解

    最近空闲时间研究了一下css。本文讲解css中display table的布局方式。 其实display tabl...

  • 前端面试题(一)

    css相关问题 1. display:none和visbility:hidden区别 display:none 隐...

  • 纯css实现垂直居中

    方法1: display: table-cell html结构: css: 方法2:display: flex h...

网友评论

      本文标题:CSS display

      本文链接:https://www.haomeiwen.com/subject/emydoftx.html