完成项目页尾

木江..

已于 2022-06-17 10:49:28 修改

阅读量148

点赞数

文章标签： css css3 前端

于 2022-06-10 16:17:24 首次发布

本文链接：https://blog.csdn.net/weixin_71809786/article/details/125223474

版权

本文详细介绍了如何使用HTML和CSS来构建网页的页尾部分。内容包括使用footer标签搭建页尾框架，通过CSS实现文字居中、颜色和大小调整，以及利用position和bottom属性将页脚固定在页面底部。此外，还运用了浮动和margin属性进行底部元素的排版和间距调整，确保布局美观。整个过程遵循逐步讲解，便于读者理解和实践。

摘要由CSDN通过智能技术生成

1.搭建页尾部框架（a,div,span,img,footer等）

2.用css样式美化头部（文字居中，字体颜色，大小，宽高等）

3.完成项目的内容

（1）用position: bottom:把footer标签内容设置到页面底部

footer{
               position: absolute;
               bottom: 0;
               background: #3E2D23;
               display: block;
           }

（2）用浮动把底部排版

footer *{
           float: left;
           color: aliceblue;
           text-align: center;

           }

（3）用margin调整字体块之间的距离

}
           footer .img1{margin-top: 20px;
           margin-left: 80px;
           height: 20px;
           width: 20px;
           }
           footer .class1{
               margin-left: 30px;

           }
           footer p span{
               margin-left: 30px;
           }
           footer>a,span{
               margin-left: 30px;

           }