CSS案例3(在线教育网站)

案例练习目的是总结以前的css和html

还有ps的使用。

制作步骤:

  1. 准备相关文件。(内部样式表) html文件(index.html) 图片文件
  2. 准备CSS 初始化。 书写结构和样式
  3. 确定版心(是1200像素)和各个模块布局(先行后列)。

头部通栏:

共四部分 logo、导航、搜索栏、个人中心

前两个左浮动,后两个右浮动

banner部分:

 背景图片+左侧侧边导航栏+右侧我的课表模块

text-align: center; /* 文字水平居中 */
font-weight: 700; /* 文字加粗 */
letter-spacing: 2px; /* 设置字间距 */
font-family: arial; /* 一般情况我们的符号都用这个字体 */
background: rgba(0, 0, 0, 0.3);/*  盒子背景半透明 */

精品推荐部分:

 1.精品推荐导航栏

 2.精品推荐大模块

底部

posted @ 2019-10-16 19:56  阿江是个程序猿  阅读(255)  评论(0编辑  收藏  举报