CSS案例3(在线教育网站)
案例练习目的是总结以前的css和html
还有ps的使用。
制作步骤:
- 准备相关文件。(内部样式表) html文件(index.html) 图片文件
- 准备CSS 初始化。 书写结构和样式
- 确定版心(是1200像素)和各个模块布局(先行后列)。
头部通栏:
共四部分 logo、导航、搜索栏、个人中心
前两个左浮动,后两个右浮动
banner部分:
背景图片+左侧侧边导航栏+右侧我的课表模块
text-align: center; /* 文字水平居中 */
font-weight: 700; /* 文字加粗 */
letter-spacing: 2px; /* 设置字间距 */
font-family: arial; /* 一般情况我们的符号都用这个字体 */
background: rgba(0, 0, 0, 0.3);/* 盒子背景半透明 */
精品推荐部分:
1.精品推荐导航栏
2.精品推荐大模块
底部