Flutter基础(前端教程①⑨-margin-padding)

比喻:把框的盒子

Container 想象成一个带边框的盒子

  • margin盒子外面的空白(盒子与周围其他东西的距离)。
  • padding盒子里面的空白(盒子边框与内部内容的距离)。

代码示例(带边框更直观):

Dart 复制代码
Container(
  // 盒子外部的空白(与其他组件的距离)
  margin: EdgeInsets.all(20), 
  // 盒子内部的空白(边框与文本的距离)
  padding: EdgeInsets.all(15),
  // 给盒子加个边框,方便看清
  decoration: BoxDecoration(
    border: Border.all(color: Colors.black, width: 2), // 黑色边框
    color: Colors.yellow, // 盒子背景色
  ),
  child: Text("我是内部文本"),
)
相关推荐
晴天167 小时前
Web 页面内存溢出与 CPU 溢出:区别、诊断与最佳实践
前端·javascript
摸鱼仙人~7 小时前
需求深度分析提示词-grill me
前端·chrome
Highcharts.js7 小时前
常见报错排雷指南3:兼容性问题的官方解法
前端·javascript·react.js·可视化·highcharts·报错解法
雪芽蓝域zzs8 小时前
第三十六节:keep-alive 页面缓存(Vue3 + 后台管理系统)
前端·vue.js·缓存
言乐68 小时前
Python加速器2视频网页加速器
前端·javascript·css·python·音视频
IT_陈寒8 小时前
为什么我的Java Stream操作总是默默吃掉异常?
前端·人工智能·后端
光影少年8 小时前
react navite浏览器 Event Loop 和 Node Event Loop 的区别
前端·javascript·react native·react.js·前端框架
90后的晨仔8 小时前
uni-app 安卓自有证书完全指南
前端
CharlesYu0118 小时前
前端性能优化的第一性原理,是不断缩短“用户发起意图 → 获得可用结果”之间的时间
前端