脚部信息 | 学习笔记

简介: 快速学习脚部信息

开发者学堂课程【零基础学前端 HTML+CSS:脚部信息 】学习笔记,与课程紧密联系,让用户快速学习知识。

课程地址:https://developer.aliyun.com/learning/course/398/detail/5158


脚部信息

完成底部的内容

在 css.css 中

.line{

width: 1px;

height: 292px;

border: 0px 1px 0px 0px;

float: left;

}

#foot{

width: 100%

min-width:960px;

max-width: 1920px;

background-color: #f2f2f2;

height: 60px;

}

image.png

显示如上图

然后在 index.html 中写入:

<div id= “foot”> 版权归属:

魔乐科技 极限 IT 程序员 </div>

刷新页面显示

image.png

这个位置可以再添加 line-height 高度

#foot{

width: 100%

min-width:960px;

max-width: 1920px;

background-color: #f2f2f2;

height: 60px;

line-height: 60px;

}

刷新得

image.png

剩下的文字地址可以加在 <div id= “foot”>版权归属:魔乐科技 极限 IT 程序员</div> 中:

<div id= “foot”>版权归属:魔乐科技 极限IT程序员 电话:400-0088-518 网址:www.mldn.cn</div>

刷新得

image.png

整体结构先给大家做一个搭建,自己可以尝试用 div css 的形式来做这样一个页面

相关文章
|
1月前
|
网络安全
信息收集简介
信息收集简介
24 2
|
4月前
|
安全 关系型数据库 MySQL
某教程学习笔记(一):05、信息收集
某教程学习笔记(一):05、信息收集
30 0
|
前端开发
前端学习笔记202305学习笔记第二十二天-信息列表页实现2
前端学习笔记202305学习笔记第二十二天-信息列表页实现2
54 1
|
前端开发
前端学习笔记202305学习笔记第二十二天-信息列表页实现1
前端学习笔记202305学习笔记第二十二天-信息列表页实现1
61 0
|
存储 前端开发 JavaScript
课程管理-修改课程信息(最终实现) | 学习笔记
简介:快速学习课程管理-修改课程信息(最终实现)
183 0
课程管理-修改课程信息(最终实现) | 学习笔记
|
前端开发 JavaScript Java
课程管理-添加课程信息前端完善(显示分类) | 学习笔记
简介:快速学习课程管理-添加课程信息前端完善(显示分类)
166 0
课程管理-添加课程信息前端完善(显示分类) | 学习笔记
|
存储 前端开发 JavaScript
课程管理-修改课程信息(前端) | 学习笔记
简介:快速学习课程管理-修改课程信息(前端)
课程管理-修改课程信息(前端) | 学习笔记
|
前端开发 数据库 开发者
课程管理-修改课程信息(后端) | 学习笔记
简介:快速学习课程管理-修改课程信息(后端)
125 0
课程管理-修改课程信息(后端) | 学习笔记
|
XML SQL Java
课程管理-课程信息确认(加载问题) | 学习笔记
快速学习课程管理-课程信息确认(加载问题)