网页布局基础_技术问答

首页免费课网页布局基础问答

网页布局基础

全部评论问答未解决精华

傲雪骑士

对于父元素的影响清除就是：width:100%;overflow:hidden;
对于自己临近的清除就是：clear：both;感谢我吧同志们
所以上面的答案就是：一：width：100%；overflow：hidden；
float:left;float:right;然后放大看这样小屏是看不到的。。。

89 3-5 编程练习

2015-10-21

easyschen

感觉听不懂了 = =

0 4-4 使用绝对定位实现横向两列布局

2015-10-20

慕頭向

真心废话太多，

0 4-4 使用绝对定位实现横向两列布局

2015-10-19

慕頭向

多出来的边其实是用padding挤图片的时候产生的，padding会把盒子撑大的。个人的一点拙见，希望可以多交流。

0 2-2 盒子模型

2015-10-19

秦小涛FM

老师讲得很不错，浅显易懂。

0 2-4 自动居中一列布局

2015-10-19

A级流寇

#wrap{width:970px; margin:0 auto;}
#mainbody{position:relative; margin-top:15px;}
#left{float:left; width:110px; }
#mid{ float:left; margin-left:13px; width:650px;border:1px solid #999;}
#right{position:absolute; top:0;right:0; margin-left:15px; width:180px; border:1px solid #999;}

1 5-1 网页布局-编程挑战

2015-10-19

A级流寇

我觉得老师的声音很好听，表达逻辑很清晰明了。很明显在教学大纲上下了很多功夫，只是发现在讲解img标签时可能让多数人误会img标签同span元素一样，这里帮大家澄清一下img元素是行内元素，非内联元素，且img元素的表现同inline-block相同， img作为一个可替换元素，可以设置内容的宽高，和上下的外边距，这在内联元素中，如span 是做不到的。

3 2-2 盒子模型

2015-10-19

菜菜的小鸟

*{margin:0; padding:0;}
#wrap{width:970px; margin:0 auto;}
#mainbody{position:relative; margin-top:15px;}
#left{float:left;width:110px; }
#mid{margin-left:123px;width:650px;border:1px solid #999;}
#right{margin-left:790px;top:0;position:absolute;border:1px solid #999;}

0 5-1 网页布局-编程挑战

2015-10-18

洪小仔

非常好，大爱!!!!!!

0 4-3 绝对定位

2015-10-18

qq_这都不是事_0

#wrap{width:970px; margin:0 auto;}
#mainbody{position:relative; margin-top:15px;}
#left{【任务2】width:110px;float:left; }
#mid{【任务2】width:650px;border:1px solid #999; float:left; margin-left:13px;}
#right{【任务3】border:1px solid #999; top:0; position:absolute; margin-left:790px;}

0 5-1 网页布局-编程挑战

2015-10-18

双代

上下 margin 不用设置为 auto，只设置右左就可以。width:100%; 也不可以，一定设置为一个不为 100% 的值。

1 2-6 练习题

2015-10-18

双代

请详细观看盒子模型的立体图片（2-2小节 07：58），从第一层到第五层依次为：border、content+padding、background-image、background-color、margin。

0 2-5 练习题

2015-10-18

小学大叔

#wrap{width:970px; margin:0 auto;}
#mainbody{position:relative; margin-top:15px;}
#left{width:110px; position:absolute; top:0; left:0;}
#mid{position:absolute;top:0px;margin-left:170px;width:650px;border:1px solid #999;}
#right{ position:absolute; right:0; top:0;border:1px solid #999;width:110px;}

0 5-1 网页布局-编程挑战

2015-10-17

imSeveNyU

static静态定位 relative相对定位 absolute绝对定位 fixed 固定定位，其中absolute和fixed 属于绝对定位

0 4-1 绝对定位布局简介

2015-10-17

silver_小灰

#wrap{width:970px; margin:0 auto;}
#mainbody{position:relative; margin-top:15px;}
#left{ float:left; width:110px; }
#mid{float:left; margin-left:13px;width:650px;border:1px solid #999;}
#right{position:absolute; left:790px; border:1px solid #999;}

0 5-1 网页布局-编程挑战

2015-10-17

首页上一页 173 174 175 176 177 178 179 下一页尾页

该课程已下架

课程须知: 1.一定要对HTML+CSS相关标签有所掌握；2.对网页布局知识有简单的了解

老师告诉你能学到什么？: 1.掌握三大布局技巧——流式布局、浮动布局及绝对定位布局；2.精通标准文档流、盒子模型、float属性以及position属性等知识。

微信扫码，参与3人拼团

热搜

最近搜索清空

网页布局基础