码农知识堂 - 1000bd
  •   Python
  •   PHP
  •   JS/TS
  •   JAVA
  •   C/C++
  •   C#
  •   GO
  •   Kotlin
  •   Swift
  • 【块级元素、行内元素、行内块元素(详解css的display属性)】


    块级元素、行内元素、行内块元素(详解css的display属性)

    块级元素:display:block;独占一行。

    可以设置元素的height、width,不设置宽度,块级元素会默认填满父级元素的宽度。
    可以设置padding、margin各个属性值,top、left、bottom、right都能产生边距效果

    行内元素:display:inline;可以与其他行内元素共享一行。

    不可以设置元素的height、width值,大小由内容撑开
    可以使用padding,padding的top、bottom、left、right都有效,margin只有left、 right产生边距效果,top、bottom不生效。

    行内块元素:display:inline-block

    融合了块级元素和行内元素的特点:
    拥有行内元素的特点,可以与其他元素共享一行,不会独占一行
    可以设置height、width、padding、margin属性值
    在同一行内有不同高度内容的元素时,通常要设置对齐方式如vertical-align: top;来使元素顶部对齐

    给块级元素

    设置display:inline-block使其变成行内块元素,让两个table处于一行并列显示。
    在这里插入图片描述

    在这里插入图片描述

  • 相关阅读:
    前端文字垂直显示且两端对齐
    【低代码】PC和移动端的页面编辑实战案例(1)
    【应用统计学】分布的偏度和峰度
    月薪9K和年薪30W的职位,有什么区别?
    图论第四天|127. 单词接龙、841. 钥匙和房间、463. 岛屿的周长
    ZooKeeper+Kafka+ELK+Filebeat集群搭建实现大批量日志收集和展示
    GPT-人工智能如何改变我们的编码方式
    函数的极限:如何通过 δ 和 ϵ 来定义一个连续的函数
    有密码pdf保存为无密码的
    Opencv 基本操作四 指针数组、vector与Mat之间的相互转换
  • 原文地址:https://blog.csdn.net/Da_Xiong000/article/details/125905109
    • 最新文章
    • 【JVM】编译执行与解释执行的区别是什么?JVM 使用哪种方式?
      用 Hashids 优雅解决 C 端自增 ID 暴露问题
      V8引擎 精品漫游指南--Ignition篇(上) 指令 栈帧 槽位 调用约定 内存布局 基础内容
      LLVM Pass快速入门(四):代码插桩
      milkup:桌面端 markdown AI续写和即时渲染
      基于项目工程构建SBOM(软件物料清单)的研究
      鸿蒙应用开发UI基础第二节:鸿蒙应用程序框架核心解析与实操
      .NET 中如何快速实现 List 集合去重?
      扣子Coze实战:从0到1打造抖音+小红书热点监控智能体
      浅谈数据访问层
    • 热门文章
    • 十款代码表白小特效 一个比一个浪漫 赶紧收藏起来吧!!!
      奉劝各位学弟学妹们,该打造你的技术影响力了!
      五年了,我在 CSDN 的两个一百万。
      Java俄罗斯方块,老程序员花了一个周末,连接中学年代!
      面试官都震惊,你这网络基础可以啊!
      你真的会用百度吗?我不信 — 那些不为人知的搜索引擎语法
      心情不好的时候,用 Python 画棵樱花树送给自己吧
      通宵一晚做出来的一款类似CS的第一人称射击游戏Demo!原来做游戏也不是很难,连憨憨学妹都学会了!
      13 万字 C 语言从入门到精通保姆级教程2021 年版
      10行代码集2000张美女图,Python爬虫120例,再上征途
    小工具 小游戏
    Copyright © 2022 侵权请联系2656653265@qq.com    京ICP备2022015340号-1

    京公网安备 11010502049817号