下面是学习文本缩进的变化形式，对我们编辑文本有很大的意义哦。我们一起来探讨一下吧！加油！ "text Indent" 是一个在文本排版领域广泛使用的属性，主要用于指定文本块（如段落）首行的缩进。在网页设计（CSS）、文字处理软件等场景中经常出现。语法 ：`text - indent: | `。<length> 可以是具体的长度单位，如像素（p x）、点（p
图解鸿蒙之线性布局-自适应延伸-水平方向布局中使用Scroll组件宝子们，我发现有些 APP 里能左右滑着看东西，这是咋弄的呀？答：嘿嘿，这是用了水平方向的 Scroll 组件哟！你就想象有个超酷的 “魔法传送履带”，把要展示的图片、图标啥的都放在上面排排站。要是它们排起来太宽，超出屏幕能看到的地方，这个 Scroll 组件就像给履带装上了小滑轮，咱们手指轻轻往左或往右一划，就能把藏在边上的宝贝一
图解鸿蒙之线性布局-自适应延伸-垂直方向布局中使用Scroll组件问：宝子，APP 里能上下滑看长内容，咋做到的？\答：用垂直 Scroll 组件啦！就像给超长内容加个滑滑梯，手指一滑，藏在下面的内容全能瞧见，超好玩。 在垂直方向布局里，Scroll 组件发挥着关键作用。它如同一个可滑动的窗口，当放置其中的内容（如文本、图片、列表项等）在垂直向超出容器可视范围时，能让用户通过上下滑动操作
图解鸿蒙之线性布局-自适应延伸问：咱平时上网的时候，哪里能看到自适应延伸在起作用呀？答：多着呢！你刷抖音的时候，那些视频不管是在大屏平板上，还是小小的手机屏幕里，视频画面都能铺满屏幕，没有大黑边，这就是自适应延伸在帮忙。还有打开一些新闻网站，文章里的图片和段落，随着你拉大拉小浏览器窗口，它们也跟着变，文字不会挤成一团，图片也不会变形，是不是超贴心？自适应延伸是指在不同尺寸设备下，当页面的内容超出屏
图解鸿蒙之线性布局-自适应缩放-使用百分比设置父容器尺寸确定时，使用百分比设置子元素和兄弟元素的宽度，使他们在任意尺寸的设备下保持固定的自适应占比哎呀，宝子！我瞅见个用百分比设子元素宽度的招儿，这是干啥用的呀？\答：嘿，你就想象父容器是个大披萨盒，尺寸已经定好咯。那用百分比设子元素和兄弟元素宽度呢，就好比给盒子里的披萨切片定大小，不管这盒子拿到大桌子（大屏设备）还是小茶几（小屏设备）上，每片披萨（
图解鸿蒙之线性布局-自适应缩放-使用layoutWeight属性设置宝子，我碰到个 “layoutWeight”，这是啥神奇咒语呀？答：嘿?，想象一下，父容器是个大蛋糕盒，尺寸已经定啦。layoutWeight 呢，就像是给盒里的小蛋糕（子元素和兄弟元素）分地盘的魔法，不管小蛋糕本来自己想长啥样（本身尺寸设置），它都能按照咱给的 “重要度权重”，在主轴上（就像蛋糕盒里的一排位置）瓜分剩余空间，让每
图解鸿蒙之线性布局-自适应拉伸问：嘿，宝子！我老听到 “自适应拉伸”，这到底啥玩意儿呀？\答：哎呀，简单说啦，就好比小橡皮筋，环境一变，它能跟着变长变短，自适应拉伸就是元素能根据装它的 “小盒子”（容器）大小，自动调整自己身材，把空间填得刚刚好，不松不紧哟！在线性布局下，常用空白填充组件Blank，在容器主轴方向自动填充空白空间，达到自适应拉伸效果。Row和Column作为容器，只需要添加宽高为百
图解鸿蒙之线性布局 - justifyContent (FlexAlign.SpaceEvenly) 水平方向均匀分配元素问：justifyContent (FlexAlign.SpaceEvenly) 有啥 "神秘大招"？\答：嘿，它就如同鸿蒙世界里的 "公平秤砣"，在线性布局这条 "流水线" 上，元素们被它安排得明明白白，不管是相邻间距，还是首尾和边界的距离，全都一般大，跟拿尺子量过似的，规整
图解鸿蒙之线性布局 - justifyContent (FlexAlign.SpaceAround) 水平方向均匀分配元素问："justifyContent (FlexAlign.SpaceAround)" 在鸿蒙里是啥奇妙招儿？\答：嘿，它就像个贴心的 "空间小管家"，在线性布局这 "大舞台" 上，把元素当成小演员，让它们间距均匀排排站，而且首尾元素离 "舞台边" 的距离，刚好是相邻演员间距的一
图解鸿蒙之线性布局 - justifyContent (FlexAlign.SpaceBetween)问："justifyContent (FlexAlign.SpaceBetween)" 是啥神奇魔法？\答：嘿，它就像个公正的 "空间分配官"，在线性布局 "大马路" 上，让元素们像汽车一样首尾对齐，均匀排开，间隔都一样，既不挤也不散，整整齐齐向前冲！justifyContent (FlexAli
图解鸿蒙之线性布局 - justifyContent (FlexAlign.End) 元素在水平方向尾部对齐问：这 justifyContent (FlexAlign.End)" 是啥奇妙门道？\答：嘿，它就像个调皮的 "队列小尾巴"，在线性布局这 "操场跑道" 上，把元素们当成小运动员，最后一个紧紧贴住跑道尾，前面的依次跟上，排得那叫一个规整，从右往左超有秩序！justifyContent (F
图解鸿蒙之线性布局 - justifyContent (FlexAlign.Center) 元素在水平方向中心对齐问："justifyContent (FlexAlign.Center)" 在是啥厉害角色？\答：嘿，它就好比舞台上的 "聚光灯操控师"，在水平 "大舞台" 上，大手一挥，元素们 "嗖" 地全奔舞台正中央，整整齐齐站一排，超亮眼，C 位出道！justifyContent (FlexAl
图解鸿蒙之线性布局 - justifyContent (FlexAlign.Start) 元素在水平方向首端对齐问："justifyContent (FlexAlign.Start)" 是啥神奇魔法呀？\答：嘿，它就像个超严领队，在水平 "跑道" 上，一声令下，元素们跟训练有素的小兵似的，第一个冲在前头紧贴行首，后面的乖乖依次跟上，排得整整齐齐。justifyContent (FlexAlign.
图解鸿蒙之线性布局 - Row 容器内子元素在水平方向上的排列Row 容器内子元素在水平方向上的排列图1. 从左对齐（justifyContent (FlexAlign.Start)：子元素从 Row 容器的最左边（行首）开始依次排列，第一个元素与容器左边沿对齐，元素之间紧密相连，没有额外的间隔。就像在跑道上，运动员从起跑线开始，一个挨着一个。2. 中心对齐（justifyContent (Fle
图解鸿蒙之线性布局 - justifyContent (FlexAlign.SpaceEvenly)问："justifyContent (FlexAlign.SpaceEvenly)" 这是啥神奇操作？\答：嘿，它就像个超公平的 "空间分配大师"，在垂直舞台上，元素们不管前后左右，间距全都一模一样，整得跟复制粘贴似的，那叫一个整齐！justifyContent (FlexAlign.SpaceEv
图解鸿蒙之线性布局 - justifyContent (FlexAlign.SpaceAround) 垂直方向均匀分配元素问："justifyContent (FlexAlign.SpaceAround)" 是啥奇妙玩意儿？\答：嘿，它就像个超贴心的 "空间魔法师"，在垂直天地里，把元素间距变得超均匀，开头离行首、结尾离行尾的距离，不多不少正好是相邻元素间距的一半，超有秩序！justifyCont
图解鸿蒙之线性布局 - justifyContent (FlexAlign.SpaceBetween) 垂直方向均匀分配元素问："justifyContent (FlexAlign.SpaceBetween)" 这是啥神奇咒语？\答：嘿，它就像个公正的裁判，在垂直舞台上，让元素们 "排排站"，开头的贴紧行首，结尾的靠住行尾，中间的间隔还都一模一样，超整齐！justifyContent (FlexA
图解鸿蒙之线性布局-justifyContent(FlexAlign.End)元素在垂直方向尾部对齐justifyContent(FlexAlign.End)：元素在垂直方向尾部对齐，最后一个元素与行尾对齐，其他元素与后一个对齐。问:“justifyContent (FlexAlign.End)” 这是啥魔法呀？\答：嘿，它就像个调皮的小捣蛋，在垂直空间里，把元素们像摞积木一样从下往上堆，最后一块
图解鸿蒙之线性布局-justifyContent(FlexAlign.Center)元素在垂直方向中心对齐justifyContent(FlexAlign.Center)：元素在垂直方向中心对齐，第一个元素与行首的距离与最后一个元素与行尾距离相同。问：“justifyContent (FlexAlign.Center)” 是何方神圣啊？\答：它呀，就好比是舞台上的 “聚光灯调度师”，在垂直空间里，
图解鸿蒙之线性布局-justifyContent(FlexAlign.Start)元素在垂直方向首端对齐justifyContent(FlexAlign.Start)：元素在垂直方向首端对齐，第一个元素与行首对齐，同时后续的元素与前一个对齐。问：这 “justifyContent (FlexAlign.Start)” 到底啥神奇招儿？\答：嘿，它就像个超严教官，在垂直 “方阵” 里，一声令下，元素
图解鸿蒙之线性布局-Column容器内子元素在垂直方向上的排列在布局容器内，可以通过justifyContent属性设置子元素在容器主轴上的排列方式。可以从主轴起始位置开始排布，也可以从主轴结束位置开始排布，或者均匀分割主轴的空间。Column容器内子元素在垂直方向上的排列图 1顶部对齐（justifyContent(FlexAlign.Start)）
图解鸿蒙之线性布局-VerticalAlign.Bottom子元素在垂直方向底部对齐问：VerticalAlign.Bottom 是啥呀，咋听起来这么神秘？答：嘿，它就像个 “魔法地板”，在 Row 容器里，不管子元素是高是矮，一碰上它，底部全给你对齐咯，整整齐齐。 VerticalAlign.Bottom 是一种用于控制子元素垂直对齐方式的概念。在包含多个子元素的 Row 容器中，它规
图解鸿蒙之线性布局-VerticalAlign.Center子元素在垂直方向居中对齐问：VerticalAlign.Center 是啥呢？\答：它呀，就好比舞台上的 “走位大师”，在 Row 容器里，能精准地把子元素都推到垂直方向的正中间，让它们稳稳 “站定”。VerticalAlign.Center 是一种布局属性，用于确保 Row 容器内的子元素在垂直方向上的中心位置对齐。简单来说，它会找到每
图解鸿蒙之线性布局-VerticalAlign.Top子元素在垂直方向顶部对齐问：啥是 VerticalAlign.Top 呀？\答：嘿，它就像个超爱 “比高” 的裁判，在 Row 容器里，让子元素们都把头顶对齐，不管高矮胖瘦。VerticalAlign.Top 是一种在布局中用于控制元素垂直对齐方式的属性。当应用于 Row 容器内的子元素时，它会使这些子元素在垂直方向上以它们的顶部为基准进行对齐
图解鸿蒙之线性布局 - Row 容器内子元素在垂直方向上的排列图Row 容器主要让子元素水平排列，而其内部子元素在垂直方向上可有多种排列方式。可顶部对齐，使子元素顶部在同一水平线；能居中对齐，让子元素中心位置处于同一直线；也能底部对齐，令子元素底部整齐排列。此外，还可以均匀分布，使子元素垂直间距及与容器边缘间距相等；或者两端对齐，充分利用容器空间，让子元素在垂直方向紧密且均匀排列 。子元素在垂直方
图解鸿蒙之线性布局 - HorizontalAlign.End 子元素在水平方向右对齐问：HorizontalAlign.End 是什么呀？答：它就像是个超贴心的 "小帮手" 呢，能指挥一堆子元素，让它们在水平方向上全都靠右站，排得整整齐齐哒。HorizontalAlign.End 是一种布局属性设定，作用是将子元素在水平方向上以右侧为基准进行对齐，实现右对齐布局效果 。PS：实际项目中如有出入，
图解鸿蒙之线性布局 - HorizontalAlign.Center 子元素在水平方向居中对齐问：嘿呀，HorizontalAlign.Center 是个啥神秘魔法呀？答：它就像一个超厉害的 "居中小能手" 哟！当咱们有一堆子元素，想让它们在水平方向上整整齐齐地待在中间的时候，这个 HorizontalAlign.Center 就闪亮登场啦，能把那些子元素稳稳地摆在中间位置，超神奇哒！Horizo
图解鸿蒙之线性布局 - HorizontalAlign.Start 子元素在水平方向左对齐问：HorizontalAlign.Start 是啥？答：它像个 "小指挥"，能把子元素在水平方向靠左排整齐。问：为啥要用它？答：做清单之类的，用它对齐，看着规整，找重点方便。HorizontalAlign.Start 是一种布局对齐方式的设定值。在各类支持布局排版的编程环境或界面设计系统中，当需要对一组子元
图解鸿蒙之线性布局 - Column 容器内子元素在水平方向上的排列在布局容器内，可以通过 alignItems 属性设置子元素在交叉轴（排列方向的垂直方向）上的对齐方式。且在各类尺寸屏幕中，表现一致。其中，交叉轴为垂直方向时，取值为 VerticalAlign 类型，水平方向取值为 HorizontalAlign 类型。alignSelf 属性用于控制单个
图解鸿蒙之线性布局 - Row 容器内排列方向上的间距Row 容器像一个 "小火车"，能把好多小元素像车厢一样，整整齐齐地排在一行哦，space 控制车厢和车厢之间的小空隙啦，能让每个小元素不挤在一起，有自己的小空间呢！调好间距，"小火车" 就会看起来更舒服、更好看，要是挤一块儿，就乱糟糟啦！Row 容器用于水平排列子元素，其排列方向上的间距指各子元素在水平方向上的间隔距离，合理设置可优化布局美感
Copyright © 2005-2025 51CTO.COM 版权所有 京ICP证060544号
