background属性

  background属性是css中应用比较多,且比较重要的一个属性,它是负责给盒子设置背景图片和背景颜色的,background是一个复合属性,它可以分解成如下几个设置项:

  a、background-color 设置背景色

  b、background-image 设置背景图片地址

  c、background-repeat 设置背景如何重复平铺

  d、background-position 设置背景图片的位置

  e、background-attachment 设置背景图片是固定还是随着滚动条滚动

实际应用中,我们可以用background属性将上面所有的设置项放在一起,而且也建议这样做,这样性能更高,而且兼容性更好。

比如:background:#f00 url(bg.png)  no-repeat   left  center fixed

   background:#f00 url(bg.png)  no-repeat   10px  25px  fixed

前端页面开发流程

  a、创建页面项目目录。

  b、使用Photoshop对效果图切图,切出网页制作中需要的小图片。

  c、将装饰类图像合并,制作雪碧图。

  d、结合Photoshop和代码编辑器,参照效果图,进行html和css代码书写,制作页面。

css背景精华所在+前端页面开发流程的更多相关文章

  1. 前端页面开发,最低兼容IE 8的多设备跨平台问题解决!

    项目要求: 网站能够使用PC.ipad.mobile phone正常访问 页面PSD版式宽度分别为1024px和750px 参考资料 使用CSS3 Media Queries,其作用就是允许添加表达式 ...

  2. vue- Vue-Cli脚手架工具安装 -创建项目-页面开发流程-组件生命周期- -03

    目录 Vue-Cli 项目环境搭建 与 python 基础环境对比 环境搭建 创建启动 vue 项目 命令创建项目(步骤小多) 启动 vue 项目(命令行方式) 启动 vue 项目(pycharm 方 ...

  3. CSS 背景图像 填充整个页面示例

    background-image 属性可以设置背景图像. 背景图像可以填充整个页面的,也可以填写一部分. background-image 属性的使用很简单:background-image:url( ...

  4. 我的前端页面开发js简易有效环境

    前端开发主要涉及到html, css(less/sass), javascript这几个方面的知识.真正的快速有效开发,必须实现所谓所见即所得.在构建生产时,可能需要使用gulp/grunt等task ...

  5. flask实战-留言板-Web程序开发流程

    Web程序开发流程 在实际的开发中,一个Web程序的开发过程要设计多个角色,比如客户(提出需求).项目经理(决定需求的实现方式).开发者(实现需求)等,在这里我们假设自己是一个人全职开发.一般来说一个 ...

  6. X5的UI部分和传统Web页面开发的差异

    http://doc.wex5.com/different-with-std-web-ui/#1 X5的UI部分和传统Web页面开发的差异 WeX5是跨端移动开发框架,BeX5是基于WeX5的企业快速 ...

  7. 自适应 or 移动前端页面布局的问题?

    说出来,还请各位看官不要笑 - -.哥们至今不是很清楚页面的自适应和移动前端页面开发有什么区别 .有幸哪位看官清楚这些的话,希望能不吝赐教 .A.meta        <meta name=& ...

  8. CSS背景图片定位

    原文:CSS背景图片定位 在网页开发中我们经常需要对图片进行分割(如下图)来使用,而不是分别提供单独的图片来调用,常见的如页面背景,按钮图标等,这样做的好处就是减少请求次数,节省时间和带宽. 对背景图 ...

  9. 0016 CSS 背景:background

    目标 理解 背景的作用 css背景图片和插入图片的区别 应用 通过css背景属性,给页面元素添加背景样式 能设置不同的背景图片位置 [插入图片,不用设置img元素的父元素.自身元素大小,即可见,但是背 ...

随机推荐

  1. MVC部分视图

    // 以视图名使用当前文件夹下的视图 // 如果没有找到,则搜索 Shared 文件夹 @Html.Partial("ViewName")   @Html.Partial(“视图” ...

  2. 360手机新品牌5月6日公布 周鸿祎席地而坐谈AK47

    今年年初,周鸿祎又做了一个艰难的决定,南下做手机!经过好一番折腾终于搞出点动静,奔驰S600L也卖了(炒作的味道很浓重),一款代号为AK47的产品被确认,就连邀请函也充分的体现了周鸿祎的老兵情节.最近 ...

  3. 【原】使用Builder模式替代构造参数传参

    前言:关于传递参数,当参数过多的时候我们可以考虑使用建造者模式. #没用 Builder模式 之前是这样传参的: 如下所示,构造方法里面的参数一大堆,看起来就非常的混乱. 用了Builder模式之后是 ...

  4. dubbo学习思路梳理

    dubbo要解决的问题 rpc调用需要定制.额外的工作量 分布式服务中,服务动辄几十上百,相互之间的调用错综复杂,相互依赖严重 对集群性的服务,需要负载策略 对集群性的服务,能动态扩展节点 dubbo ...

  5. hdu 3295 模拟过程。数据很水

    An interesting mobile game Time Limit: 3000/1000 MS (Java/Others)    Memory Limit: 65535/32768 K (Ja ...

  6. windows多线程窗口程序设计

    掌握windows基于消息驱动的窗口应用程序设计的基本方法,掌握窗口程序资源的概念与设计,掌握常用的消息的程序处理方法,掌握文字图形输出相关函数编程.掌握设计的基本方法(选项),掌握时钟消息设计动画程 ...

  7. zookeeper 选举

    选举概述: 1.启动时期的选举 所有的服务器状态为 LOOKING. 1.1.每个Server 会投出一票(投票规则为:SID.ZXID ,即 服务器ID 和 最大事务ID). 1.2.处理选票 (A ...

  8. Golang beego ORM + CRUP 操作详解

      构建beego Web 项目         首先构建一个beego 的web 项目,这个我们完全可以参考beego 官网中的开发文档,上面介绍的非常的详细,在这我就不给大家介绍,主要是介绍ORM ...

  9. Review——JS的异步与同步

    一.概念 同步(synchronous):指在js的主线程上,所有任务被依次执行: 异步(asynchronous):指任务不进入主线程,进入任务队列(task):当“任务队列”通知主线程,异步任务才 ...

  10. javaweb jdbc实现简单的数据库基本操作和servlet的作用域以及jsp标签的使用

    一,工具类,分页类和连接数据库jdbc package com.direct.util; import java.sql.Connection; import java.sql.DriverManag ...