CSS中为什么有的元素能够设置高度,而有的元素却不能设置高度与宽度?
可以使用{display:block}将内联元素变为块级元素,同时使用{display:inline}将块级元素变为内联元素。
{display:inline-block}又是怎么回事,根据张鑫旭老师《CSS的世界》中的解释可以理解为,每个元素都有两个盒子,外在的盒子和内在的盒子,外在的盒子负责元素是可以一行显示,还是只能换行显示,内在的盒子负责宽高、内容的呈现。
{display:block}
{display:inline}
{display:inline-block}。
实际中我们常常见到的{display:table} {display:inline-table}那又是怎么回事呢?
首先,我们要区分一个概念:“块级元素”与{display:block}不是一个概念。常见的块级元素<li>默认的值为list-item,而<table>元素的默认的display的值为table。
{display:table}代表着此元素会作为表格来显示,表格前后带有换行符
{display:block} 此元素将显示为块级元素,此元素前后会有换行符。
{display:none}此元素不会被显示
{display:table-cell}
CSS中为什么有的元素能够设置高度,而有的元素却不能设置高度与宽度?的更多相关文章
- css中的流,元素,基本尺寸
流 元素 基本尺寸 流之所以影响整个css世界,是因为它影响了css世界的基石 --HTML HTML 常见的标签有虽然标签种类繁多,但通常我们就把它们分为两类: 块级元素(block-level e ...
- CSS中overflow:scroll怎么设置只上下滚动而不左右滚动
CSS中"overflow:scroll"默认是左右,上下都滚动.怎么设置只上下滚动而不左右滚动,下面有个不错的解决方法 CSS中"overflow:scroll&quo ...
- 简要的谈一谈我对CSS中长度单位的理解
CSS中的长度单位目前分为两种,分别是绝对长度和相对长度.绝对长度单位包括: in:英寸 cm:厘米 mm:毫米 pt:磅(1磅等于1/72英寸) pc:pica(1pica等于12磅) 以上五个就是 ...
- CSS中的display属性
CSS中的display属性 display:block是可以把非块级元素强制转换为块级元素显示,如内嵌元素span,原来不支持设置宽高,宽度是由内容撑开的,几个span元素是在同一行内的,如果给sp ...
- CSS中默认被继承的属性
在CSS中,所有属性都可以被继承,只需要显式的设置属性值为inherit即可.如果不设置该属性,CSS大部分属性默认不会从父元素继承而是设置初始值(initial value),但是有一部分属性,默认 ...
- HTML与CSS中的文本个人分享
文本 标题元素 注意: 在一个HTML页面中最好只使用一个<h1>标题 因为浏览器只会抓取一个多了没用 示例代码: <body> <!-- 标题元素 - <h1&g ...
- 深入学习CSS中如何使用定位
CSS中定位介绍 position属性在英文单词中表示位置的意思,在CSS中主要作用设置元素的定位. CSS中一共有3种定位如下: 属性值 描述 fixed 设置固定定位. relative 设置相对 ...
- HTML和CSS设置动态导航以及CSS中伪元素的简单说明
HTML页面代码: <!DOCTYPE html> <html> <head> <title>Test</title> <meta c ...
- CSS中设置元素的圆角矩形
圆角矩形介绍 在CSS中通过border-radius属性可以实现元素的圆角矩形. border-radius属性值一共有4个,左上.右上.左下.右下. border-radius属性值规则如下:第一 ...
随机推荐
- 修改Visual Studio的默认模板
如果我在Visual Studio创建的项目中每次新建一个文件,自动生成注释或者是结构的话,那么就需要改下默认的模板了.下面以vs2013为例 我们添加的文件有很多种,这里就举例3种,CSharp类文 ...
- mybatis之动态SQL操作之删除
/** * 持久层 */ public class StudentDao { /** * 动态SQL--删除 */ public void dynaSQLwithDelete(int... ids) ...
- Svn CleanUp failed–previous operation has not finished
Svn CleanUp遇到错误,解决办法: 下载sqlite3.exe 放至要CleanUp的目录中, 命令行进入sqlite3.exe所在目录, 连接数据库 删除工作队列,(此时再CleanUp提示 ...
- 线程池使用Callable示例【我】
实际工作中可以把下面的代码直接拿过去改改即可 package threadtest; import java.util.ArrayList; import java.util.HashMap; imp ...
- 小D课堂-SpringBoot 2.x微信支付在线教育网站项目实战_3-5.PageHelper分页插件使用
笔记 5.PageHelper分页插件使用 简介:讲解开源组件,mybaits分页插件的使用 1.引入依赖 <!-- 分页插件依赖 --> ...
- CentOS7或CentOS8 安装VirtualBox Guest Addon缺少kernel-headers的解决办法
CentOS7或CentOS8 在Oracle VM VirtualBox中安装Guest Addon时,如果缺少kernel-headers和相应的编译库,会提示出错. "kernel h ...
- Element-UI 框架 el-scrollbar 组件
Element-UI 框架 el-scrollbar 组件:https://juejin.im/post/5c83d5ac5188257e1c4dc9e7
- merge效率
测试merge效率 测试说明: MERGE是oracle提供的一种特殊的sql语法,非常适用于数据同步场景,即: (把A表数据插到B表,如果B表存在相同主键的记录则使用A表数据对B表进行更新) 数 ...
- Linux 网络 I/O 模型简介(图文)(转载)
Linux 网络 I/O 模型简介(图文)(转载) 转载:http://blog.csdn.net/anxpp/article/details/51503329 1.介绍 Linux 的内核将所有外部 ...
- MySQL慢查询—开启慢查询
###一.简介 开启慢查询日志,可以让MySQL记录下查询超过指定时间的语句,通过定位分析性能的瓶颈,才能更好的优化数据库系统的性能. ###二.参数说明 slow_query_log 慢查询开启状态 ...