HTML+CSS编写静态网站-27 清空footer浮动属性
2017-07-06 07:29
477 查看
视频教程观看地址:http://study.163.com/course/courseMain.htm?courseId=1003879015 现在,让我们继续。最后需要我们应用样式的是我们的列表项中的段落。 所以,我要选择我们的gallery下面的li下面的a下面的p,设置margin为0,因为段落在默认情况下有一定的边距。然后,我们将padding设置为5%,然后,我们想减小字体的大小,因为它们有点大。所以我们将它设置为0.75 em。最后,我们要调整颜色。我们将它设置为bdc3c7:
#gallery li a p{ margin:0; padding:5%; font-size:0.75em; color:#bdc3c7; } |
接着,我们还需要解决的一件事情。我们来到页脚,你会注意到它在我们的画册里面。这是因为它也被浮动的属性影响。所以,我们需要清除掉左边和右边的浮动对footer的影响。所以,让我们找到我们的footer并添加一个名为clear的属性。
我们将clear的值设置为both,因为我们希望左右两侧的影响都被清除:
/* ************************************** FOOTER ************************************** */ footer{ font-size:0.75em; text-align:center; clear:both; padding-top:50px; color:#ccc; } |
现在,注意到页面顶部仍然存在对齐问题,但是当我们对导航和标题进行修改时,我们再来解决这个问题。
更多精彩内容尽在视频中!
本文固定链接:http://www.oxox.work/web/html-css/clear-float/ | 虚幻大学
查看原文:http://www.oxox.work/web/html-css/clear-float/
相关文章推荐
- HTML+CSS编写静态网站-20 CSS颜色属性详解
- HTML+CSS编写静态网站-32 为关于页面添加样式
- HTML+CSS编写静态网站-02 开发环境的搭建
- HTML+CSS编写静态网站-19 课后作业04
- HTML+CSS编写静态网站-28 调整标题和导航
- HTML+CSS编写静态网站-23 如何调用外部字体
- HTML+CSS编写静态网站-10 添加画册结构
- HTML+CSS编写静态网站-13 包含外部css样式
- HTML+CSS编写静态网站-26 创建画册样式
- HTML+CSS编写静态网站-16 使用div
- HTML+CSS编写静态网站-08 课后作业02
- HTML+CSS编写静态网站-04 课后作业01
- HTML+CSS编写静态网站-21 在css中使用class
- 静态的京东商城网站编写01(学完css和html之后就可以编写)
- HTML+CSS编写静态网站-01 课程简介
- HTML+CSS编写静态网站-06 创建基础结构
- HTML+CSS编写静态网站-07 网页内容结构的搭建
- HTML+CSS编写静态网站-24 调整页面文本
- HTML+CSS编写静态网站-22 组织css文件并添加注释
- HTML+CSS编写静态网站-18 开发手机网站