HTML(13)——显示模式

A阳俊yi2024-06-23 18:29

目录

显示模式

块级元素

行内元素

行内块元素

转换显示模式

显示模式：标签的显示方式

作用：布局网页时，根据标签的显示模式选择合适的标签摆放内容

显示模式

块级元素

  • 独占一行
  • 宽度默认为父级的100%
  • 添加宽高属性生效

行内元素

  • 一行可以显示多个
  • 设置宽高属性不生效
  • 宽高尺寸由内容撑开

行内块元素

  • 一行可以显示多个
  • 设置宽高属性生效
  • 宽高尺寸可以由内容撑开

转换显示模式

属性名：display

属性值 效果
block 块级
inline-block 行内块
inline 行内
相关推荐
GGBond今天继续上班15 分钟前
只需要一条命令，让所有 AI 应用工具共享 skills
前端·人工智能·开源
Hilaku20 分钟前
为什么我不建议普通前端盲目卷全栈？
前端·javascript·程序员
啃玉米的艺术家20 分钟前
监控项目------（boa移植问题）
前端·chrome
哀木29 分钟前
手搓你的 AI 外置记忆，连接飞书体验直接脚踢龙虾
前端·ai编程
董董灿是个攻城狮30 分钟前
荣耀一个做手机的，凭啥机器人夺冠？
前端
CDN36041 分钟前
【前端进阶】告别“慢”与“不安全”：我是如何用360CDN搞定API加速和HTTPS的
前端·安全·https
Rabbit码工42 分钟前
HTML5 与 CSS3 新特性全解析：从结构优化到视觉升级
前端·css·css3·html5
王美丽1.8543 分钟前
css3选择器
前端·css·css3
噜噜薯43 分钟前
HTML5和CSS3的核心新增特性及其语法
前端·css3·html5
.Cnn1 小时前
Ajax与Vue 生命周期核心笔记
前端·javascript·vue.js·笔记·ajax
热门推荐
012026年4月技术前沿：AI大模型爆发、智能体革命与量子安全新纪元02GitHub 镜像站点032026 年 AI 编程助手全面对比评测：Cursor vs Copilot vs Claude Code vs GitHub Copilot Free04AI Weekly | 2026年4月第二周 · GitHub热门项目与AI发展趋势深度解析05Claude Code Windows 兼容性问题：指定版本 2.1.112 可解决06GPT-6发布日深度解析-Symphony架构200万Token实战07从零部署 Hermes Agent：一只"会成长的 AI 马"保姆级安装教程08零成本！Ollama本地部署国产大模型全指南（支持Kimi-K2.5/GLM-5/Qwen，新手秒上手）09从限购到畅通：GLM-5.1 Coding Plan接入攻略10从旧版到 v0.20.5：Ollama 升级避坑全流程（附命令复制即用）