02 CSS块级元素和行内元素

划分依据:根据标签内部可以存放的元素内容不同进行划分,它与CSS样式无关。

要先了解这个 得先了解 什么是容器级别的标签和文本级

容器级标签

什么是容器级标签

  • 内部可以存放任意内容,包括容器级标签。比如:
  • p div h ul ol dl li dt dd

文本级标签

什么是文本级标签

  • 内部只能存放文字或者类似文字的内容。比如
  • 存放图片、表单元素等

块级元素

什么是块级元素?

  • 块级元素会独占一行
  • 行内元素不会独占一行

行内元素

什么是行内元素

  • 不会独占一行
  • 如果没有设置宽度, 那么默认和内容一样宽
  • 行内元素是不可以设置宽度和高度的

行内块级元素

为了能够让元素既能够不独占一行, 又可以设置宽度和高度, 那么就出现了行内块级元素

02 CSS块级元素和行内元素的更多相关文章

  1. css块级标签,行内标签,行内块标签的转换(2)

            css块级标签,行内标签,行内块标签的转换 版权声明 本文原创作者:雨点的名字 作者博客地址:https://home.cnblogs.com/u/qdhxhz/ 在基础1中,我详细讲 ...

  2. css块级标签、行内标签、行内块级标签

    <html><head lang="en"> <meta charset="UTF-8"> <title>< ...

  3. 【CSS3】块级元素与行内元素的区别

    一.行内元素与块级函数的三个区别 行内元素的特点: 和其他元素都在一行上: 高,行高及外边距和内边距部分可改变: 宽度只与内容有关: 行内元素只能容纳文本或者其他行内元素. 行内元素设置width无效 ...

  4. CSS里常见的块级元素和行内元素

    根据CSS规范的规定,每一个网页元素都有一个display属性,用于确定该元素的类型,每一个元素都有默认的display属性值,比如div元素,它的默认display属性值为“block”,成为“块级 ...

  5. CSS学习笔记——盒模型,块级元素和行内元素的区别和特性

    今天本来打算根据自己的计划进行前端自动化的学习的,无奈早上接到一个任务需求需要新增一个页面.自从因为工作需要转前端之后,自己的主要注意力几 乎都放在JavaScript上面了,对CSS和HTML这方面 ...

  6. CSS样式设置语法全解,样式优先级、值和单位、字体、文本、块级元素,行内元素,替换元素、非替换元素、display、float、position、table、li、光标、边距边框、轮廓、颜色背景

    全栈工程师开发手册 (作者:栾鹏) 一个demo学会css css选择器全解 css操作语法全解 CSS样式设置语法全解: 样式优先级 1. !important标记的样式 > 内联样式(sty ...

  7. css块级元素和行内元素详细解析

    块级元素和行内元素是布局中常见的两种基本元素,但是未必有很多人深入的研究它们的细微差别. 常见块级元素:div  p  form ul ol li 等: 常见的行内元素:span stronh em; ...

  8. 【CSS系列】块级元素和行内元素

    块级元素: 块级元素生成一个元素框,默认会填充其父元素的内容区,旁边不能有其他元素,换句话说,它在元素框之前和之后生成了“分隔符”. 列表项是块级额元素的一个特例,除了表现方式与其他块元素一致,列表项 ...

  9. CSS标准文档流 块级元素和行内元素

    标准文档流 什么是标准文档流 宏观的将,我们的web页面和ps等设计软件有本质的区别,web 网页的制作,是个“流”,从上而下 ,像 “织毛衣”.而设计软件 ,想往哪里画东西,就去哪里画 空白折叠现象 ...

随机推荐

  1. Java 线程安全 与 锁

    Java 线程安全 与 锁 多线程内存模型 线程私有栈内存 每个线程 私有的内存区域 进程公有堆内存 同一个进程 共有的内存区域 为什么会有线程安全问题? 多个线程同时具有对同一资源的操作权限,又发生 ...

  2. Django-ORM-连表正反操作

    一.A表男生,B表女生,C表关系 1通过A表查与某个男生有关系的所有女生 思想1:在A表中确认男生后,通过反查到C表,获取相关内容(QuerySet),然后再跨到B表获取所有女生信息. obj=mod ...

  3. R 数据可视化: PCA 主成分分析图

    简介 主成分分析(Principal Component Analysis,PCA)是一种无监督的数据降维方法,通过主成分分析可以尽可能保留下具备区分性的低维数据特征.主成分分析图能帮助我们直观地感受 ...

  4. Java 18 新增@snipppet标签,注释中写样例代码更舒适了!

    在这次的Java 18中,新增了一个@snipppet标签,主要用于JavaDoc中需要放示例代码的场景.其实在Java 18之前,已经有一个@code标签,可以用于在JavaDoc中编写小段的代码内 ...

  5. 深入了解tomcat中servlet的创建方式实现

    Tomcat如何创建Servlet? A.先到缓存中寻找有没有这个对象(Servlet是单实例的,只会创建一次) 如果没有: 1.通过反射去创建相应的对象(执行构造方法) 2.tomcat会把对象存放 ...

  6. Swift服务的基本使用

    swift概述 Swift 最初是由Rackspace公司开发的高可用分布式对象存储服务,并于2010年贡献给OpenStack开源社区作为其最初的核心子项目之一,为其Nova子项目提供虚机镜像存储服 ...

  7. 面试官:RocketMQ是什么,它有什么特性与使用场景?

    哈喽!大家好,我是小奇,一位热爱分享的程序员 小奇打算以轻松幽默的对话方式来分享一些技术,如果你觉得通过小奇的文章学到了东西,那就给小奇一个赞吧 文章持续更新 一.前言 作为一名Java程序员,Roc ...

  8. 这 BUG,绝了

    上周只上了三天班,但我也丝毫不敢懈怠,BUG 更是一个也没少写. 看着满屏幕的 ERROR,我陷入沉思.为什么我写的代如此烂,无法像大牛们写的那般优雅? 越想越自卑,越想越抑郁.我觉得这样不行,一定得 ...

  9. Python3获取5000个元素的单字符表

    技术背景 此前考虑过一个问题,有没有办法获取到python里面所有定义好的单字符的表,比如我们获取5000个不一样的单字符,但是常用的chr(number)的方法里面包含了太多的非字母条目,比如缩进换 ...

  10. Linux下使用ssh测试端口是否开启

    当服务器上不允许使用telnet时,可以使用ssh测试远程服务器端口是否开启 具体命令如下 -v 显示连接debug信息 -p port 指定端口 ssh -v -p 80 root@192.168. ...