关于HarmonyOS的学习
day10
一、多列布局
{ margin: 0; padding: 0; } .container{ width: 800px; min-height: 300px; border: 1px solid; margin: 50px auto; padding: 20px; / 列宽 / / column-width: 100px; / / 列数 / / column-count: 5; */
/* 列宽和列数可以简写 */ columns: 100px 5;
/* 列边距 / / column-gap: 20px; / / 列边框 / column-rule: 2px dashed orange; } h1{ / 标题是否跨列显示 */ column-span: all; text-align: center; margin-bottom: 20px; } </style> </head> <body>
不负青春不负国！点赞巴黎奥运会“00”后中国小将
在本届奥运会上，不少“00”后中国运动员让我们印象深刻。新时代的他们敢拼、自信，调皮可爱，也勇于担当。他们，正在接过奥林匹克精神的接力棒。
10米气步枪混合团体，17岁的黄雨婷戴着白色发卡，网友这样评价她“戴最萌的发卡，打最狠的枪”。而男子10米气步枪决赛，盛李豪全程不戴耳塞射击的身影，惊艳了全场。
11岁的郑好好7岁学滑板，9岁参加全运会，10岁开始参加国际大赛，11岁参加奥运会。很多人说这是玩着玩着就玩进了奥运，但是在这条“玩”的路上，郑好好骨折、摔伤过膝盖、还摔掉过指甲。
二、BFC
块级格式上下文 BFC其实就是一个一个的规则，某些规则咱们一直在使用只是不知道而已
面试回答 BFC是块级格式上下文，是页面上的一个独立容器，容器里面的元素不会影响到外面的元素。BFC可以解决很多的问题，例如：高度塌陷（清除浮动）、margin上下值重叠、自适应两栏布局等等
三、三角效果
width: 0 height: 0; border-left: 30px solid transparent; border-right: 30px solid transparent; border-top: 30px solid transparent; border-bottom: 30px solid skyblue;
四、标题定位
*{
margin: 0;
padding: 0;
}
div{
width: 1000px;
border-top: 1px solid red;
margin: 100px auto;
position: relative;
}
div h1{
width: 180px;
height: 30px;
background-color: #fff;
font-size: 18px;
text-align: center;
line-height: 30px;
position: absolute;
left: 0;
right: 0;
top: -17px;
margin: 0 auto;
}
body：
h1>张喜欢代码
讨论HarmonyOS开发技术，专注于API与组件、DevEco Studio、测试、元服务和应用上架分发等。
更多推荐
4
0- 0
已为社区贡献33条内容
所有评论(0)