六个案例学会响应式布局_技术问答

首页免费课六个案例学会响应式布局问答

六个案例学会响应式布局

                
                大谷
            Web前端工程师

                    查看讲师更多课程 
                    大谷讲师的其他课程
                
Map从入门到性能分析
初级·8451
免费课程
                                
4小时快速体验ES6-10的强大
慕课微课·入门·2292

                                                                                                                                    ￥36.00
                                            
vue-cli全集
入门·44794
免费课程
                                
解密IconFont字体图标
初级·6409
免费课程
                                
                难度入门
            
                时长 2小时41分
            
                学习人数
            
综合评分9.93
                            16人评价
                        查看评价
                                9.9
                                内容实用
                            
                                10.0
                                简洁易懂
                            
                                9.9
                                逻辑清晰

全部评论问答未解决精华

文字宽度哪里没反应

+ 我来回答回答最高可+2积分

0 回答 237 浏览 3-8 课堂案例2-长表单布局

2023-03-16

老师，我敲出来为什么运行不了，麻烦老师看下

最新回答 / 慕梦前来

你这个要看浏览器支持箭头函数不，

1 回答 220 浏览 4-1 课堂案例3-rem的使用方法

2022-08-23

一块小海绵

非常好的讲解，这下终于弄懂了flex，一直在看阮一峰的文字讲解，学了个一知半解。

0 4-5 课程小结

2022-03-20

案例中的图片怎么获得

最新回答 / weibo_闭眼就可以摸到星星哦_0

图片无所谓，到时候写需求会给你发高清图片，就实现功能就可以拉

1 回答 337 浏览 4-4 课堂案例6-rem弹性布局

2022-02-17

为什么输入text-align之后没有对齐？

最新回答 / 推理Boy

我的没有，请贴出代码

5 回答 347 浏览 3-8 课堂案例2-长表单布局

2021-12-23

慕雪1147550

感谢老师，讲的很好。很多模糊的概念在这里得到了清晰的解释。

0 4-5 课程小结

2021-12-18

flex-shrink疑惑

最新回答 / 慕雪1147550

因为是要按比例缩小啊。基准是300，缩小时按照比例用300来减掉。

1 回答 393 浏览 3-5 flex-给子元素设置伸缩比例flex属性

2021-10-27

慕粉2103217237

items [ˈaɪtəmz]

0 3-4 flex-交叉轴的对齐方式

2021-10-22

想要例子中的图片，或者老师能不能发源码给我

+ 我来回答回答最高可+2积分

0 回答 299 浏览 4-4 课堂案例6-rem弹性布局

2021-08-26

放飞梦想520

奥利给干啦

0 2-2 @media常用参数

2021-07-14

慕UI2478098

免费的比收费的还好

1 3-4 flex-交叉轴的对齐方式

2021-06-27

weixin_宝慕林0112487

举个例子：
#div0{
width:200px;
display:flex;
height:500px;
}
#div0 div:nth-child(1){
flex:0 1 150px;
}
#div0 div:nth-child(2){
flex:0 1 250px;
}
用他的错误计算方法是
200-（150+250）=-200
-200/2=-100
div1:150-100=50
div2:250-100=150
而正确值是75和125

2 3-5 flex-给子元素设置伸缩比例flex属性

2021-06-23

weixin_宝慕林0112487

10:45秒计算 flex-shrink 的方法是错误的。
错误的方法却造成了正确的结果是由于两个元素的flex-basis一样。
正确的算法应该是：
1：计算差值 400-（300+300）=-200
2：计算权重 300*1+300*3=1200
3：计算被移除量：
div1:-200*1(flex-shrink)*300/1200=-50
div2:-200*3(flex-shrink)*300/1200=-150
实际宽度：
div1:300-50=250
div2:300-150=150

2 3-5 flex-给子元素设置伸缩比例flex属性

2021-06-23