发表于: 2016-11-17 22:43:33
2 1902
昨天出去了一天,没有做什么,也就一点时间看了一丁点《CSS那些事儿》。就先跟今天的日报合并写了。
今天完成的事情:本来心里想着看《CSS那些事儿》把CSS基础过完,但是看的时候到第4章布局那里发现似乎有点小问题,有点对不上,于是谷歌搜索,CSS布局。学习了圣杯布局。参考:http://alistapart.com/article/holygrail
#header,#footer{
background-color: lime;
}
#container{
padding-left: 200px;
padding-right: 190px;
overflow: hidden;
}
#container .column{
float: left;
position: relative;
padding-bottom: 20010px;/*完成了等高*/
margin-bottom: -20000px;
}
#center{
padding: 10px 20px;
width: 100%;
background: gray;
}
#left{
width: 180px;
padding: 0 10px;
margin-left: -100%;
right: 240px;
background: blue;
}
#right{
width: 130px;
padding: 0 10px;
margin-right: -190px;
background: red;
}
#footer{
clear:both;
position: relative;
}
明天计划的事情:学习双飞翼布局、瀑布流布局,了解flexbox知识
遇到的问题:1.圣杯布局是一种成熟的布局方式,测试时发现如果left,right,center里面的文字过多,则会导致字体跑出所在区域,如何使得显示所有元素?
2.css学习是这样看书过,还是通过做界面用的时候学习?
收获:圣杯布局,center左右内边距分别设置为左右容器宽度,left,right,center设置相对定位,向左浮动,left左外边距设置-100%,顶到center左边缘,再right:左边宽度即可到达左侧。右侧只需右外边距为右边宽度即可。
发现写日报真是一个好习惯,另外值得点赞的一点是,有师兄review,可以知道自己学习中的不足,也可以把问题及时提问出来,支持!,如果可以的话,希望有机会线下学习一下,虽然自学是个门路,不过自己找路多少还是要走些弯路啊,想想以前还是浪费了好多时间啊,配置sublime,访问Google,注册github,调试界面
评论