案例练习目的是总结以前的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.精品推荐大模块

底部

CSS案例3(在线教育网站)的更多相关文章

  1. 强力Django+杀手级xadmin开发在线教育网站

    强力Django+杀手级xadmin开发在线教育网站采用 Python3.7全新开发 整个课程都看完了,这个课程的分享可以往下看,下面有链接,之前做java开发也做了一些年头,也分享下自己看这个视频的 ...

  2. 在线学编程!十大IT在线教育网站推荐

    在线学编程!十大IT在线教育网站推荐 1.CSDN学院(http://edu.csdn.net/) CSDN学院是CSDN推出的一个面向中国软件开发者和IT专业人员的技术教育服务平台.主要提供IT领域 ...

  3. 在线学习体验大PK 云智慧发布在线教育网站性能监测报告

    互联网不但改变了我们的生活.娱乐和消费方式,也推动各行各业进行着快速变革,越来越多的职场人士必须通过不断的学习.充电才能跟上行业发展的步伐,获得职业的提升,而这也引发了国内教育市场的爆炸式发展.据统计 ...

  4. django在线教育网站开发---需求分析

    开发目录: django app设计 user model.py 编写 courses models.py 编写 -Course 课程基本信息 -Lesson 章节信息 -Video -视频 -Cou ...

  5. 又一家自适应学习平台上线,大讲台主攻IT在线教育

    自适应学习技术自2015年以内,越来越受到在线教育公司的关注和重视,极客学院创始人靳岩7月初在接受媒体采访时曾提到,百万用户只是极客学院的第一步,下一步的目标是自适应学习.靳岩认为,自适应学习代表未来 ...

  6. 基于MVC的网站和在线教育系统

    最近老表说要创业,想要做一个网站做宣传,还想要一个在线教育系统. 学习了一部分 Java,  决定用.Net MVC做官网或直接做成静态HTML网站,主要是因为.Net MVC 技术简单,效率高,需求 ...

  7. 第三百八十八节,Django+Xadmin打造上线标准的在线教育平台—网站列表分页

    第三百八十八节,Django+Xadmin打造上线标准的在线教育平台—网站列表分页 分页可以用一个第三方分页模块django-pure-pagination 下载地址:https://github.c ...

  8. 第三百八十七节,Django+Xadmin打造上线标准的在线教育平台—网站上传资源的配置与显示

    第三百八十七节,Django+Xadmin打造上线标准的在线教育平台—网站上传资源的配置与显示 首先了解一下static静态文件与上传资源的区别,static静态文件里面一般防止的我们网站样式的文件, ...

  9. 小D课堂-SpringBoot 2.x微信支付在线教育网站项目实战_1-4.在线教育后台数据库设计

    笔记 4.在线教育后台数据库设计     简介:讲解后端数据库设计    ,字段冗余的好处,及常见注意事项 1.数据库设计:          er图:          实体对象:矩形        ...

随机推荐

  1. SpringBoot Controller 中使用多个@RequestBody的正确姿势

    最近遇到Controller中需要多个@RequestBody的情况,但是发现并不支持这种写法, 这样导致 1.单个字符串等包装类型都要写一个对象才可以用@RequestBody接收: 2.多个对象需 ...

  2. docker 常用

    docker 163仓库 # 更换docker源163 vim /etc/docker/daemon.json { "registry-mirrors": ["http: ...

  3. UVA11021 Tribles 概率dp

    题目传送门 题意:开始有$k$只兔子,每只都是活一天就死,每只死前都会有$pi$的概率生出$i$只兔子.求$m$天后兔子死光的概率. 思路: 设$f[i]$为一只兔子在第i天死完的概率,那么答案就是$ ...

  4. 几种数据类型的常用API

    数字 int() 字符串 #==========join===========在字符串前后插入字符 li = 'alexericrain' new_li = '_'.join(li) print(ne ...

  5. Aira搭建

    Aira下载地址 https://github.com/aria2/aria2/releases AriaNg下载地址 https://github.com/mayswind/AriaNg/relea ...

  6. wpf tabcontrol内的datagrid的selectionChanged事件向往传递问题

    tabcontrol 内的一个tabitem里是datagrid 当程序相应datagrid的selectionchanged事件后会向上传递到tabcontrol的selectionchanged事 ...

  7. look at me

    I would bet my life, like I bet my heart我以生命与真心担保That you were the one, baby你就是我的命中注定I've never been ...

  8. Android Android Studio 如何导出 Jar 给 Unity 使用

    大致步骤如下: 1.创建新的 Android Studio 工程 2.为此 Android Studio 工程创建 Android Library 类库(也就是一个 Module)(后面就是用它生成 ...

  9. Dart编程变量

    变量是"存储器中的命名空间",用于存储值.换句话说,它作为程序中值的容器.变量名称称为标识符.以下是标识符的命名规则 - 标识符不能是关键字. 标识符可以包含字母和数字. 标识符不 ...

  10. php上传(一)

    php上传基础知识总结 1.文件上传 1>文件上传的原理:将客户端上的文件通过浏览器上传到服务器上, 在将服务器上的文件移动到指定目录. 2>客户端的配置 表单页面,浏览框 method= ...