为了账号安全,请及时绑定邮箱和手机立即绑定

一课全面掌握主流CSS布局

难度初级
时长 5小时 0分
学习人数
对加深布局理解还是有帮助的~

已采纳回答 / 慕先生xuyu
1.可以设置百分比宽度。2.根据媒体查询 设置不同分辨率下 输入框的固定宽度如下:@media screen and (max-width: 1920){input.xxx{width: 200px}  }@media screen and (max-width: 1780){input.xxx{width: 180px}  }
课程很好,对我很有帮助
#parent{
height: 600px;
line-height: 600px
}
父级高度固定的话,这样也能垂直居中

最新回答 / 德玛西亚之前端
td标签(display:table-cell)1) td默认继承tr的高度,且平分table的宽度2) 若table(display:table)不存在,给td设置的宽高不能用百分比只能用准确的数值3) 给td设置vertical-align: middle; td元素里面(除float、position:absolute)所有的块级、非块级元素都会相对于td垂直居中4) 给td设置text-align: center; td元素里面所有非block元素(除float、position:absolute...

最新回答 / ccyy_阿亮
你自己再加个parent-fix容器,设置该容器“display: table; width: 100%”。因为你目前的表宽是根据单元格内容大概200px和width设置值100%算出来的。如果不显式设置table宽度,根据单元格的内容和单元格的width设置去算总列宽,总列宽会作为表宽。如果显示式设置了table宽度,跟上面一样要算出总列宽。如果表宽大于总列宽,会把多余的分配给列;如果表宽小于总列宽,表宽会被忽略,总列宽会作为表宽。这两条规则其实不太严谨,中间过程会更复杂,具体去查相关资料吧~
#left 删除:position:relative;#right 使用 margin-right: -150px 向右偏移 替代 margin-left,也可以实现同样的效果。
属性拼写错误,不是 text-algin,而是 text-align。
个人认为弹性盒子布局实现圣杯模式是最方便最快速且不用担心移动端的适配问题。而css grid网格,并不是所有浏览器都支持,所以,暂时不太建议大规模使用。老师讲的这个方法,面试的时候准备准备还是很有好处的。

最赞回答 / 慕粉3959400
查了一下,可以给right-fix的 width属性设置为 width:calc(100% - 400px),同时left上的position也不用写了,calc()自适应布局属性是css3新增。个人踩坑补充一下,calc支持加减乘除,但是运算符号左右两边必须要有空格
如果说,项目需要进行兼容性处理就不能用flex,比如说ie

最新回答 / HuiAzir
这是因为 border-box 计算的宽度 = content+padding+border
加一个选择器 :not(:first)不就解决了第一个padding问题了吗
¥48.00
立即购买
课程须知
1、提前了解和熟悉HTMLl/CSS等基础语法 2、建议对着视频反复练习,掌握每一个知识点。
老师告诉你能学到什么?
(1)居中布局:水平居中、垂直居中 (2)多列布局:两列布局、三列布局、圣杯布局、双飞翼布局 (3)全屏布局:等分布局、等高布局、全屏布局
加群二维码
  • 慕课前端核心用户群
  • QQ群号:908286289
  • 付费用户专享
  • 技术学习型社群

微信扫码,参与3人拼团

意见反馈 帮助中心 APP下载
官方微信
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?

举报

0/150
提交
取消