<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>样式</title>
    <link rel="stylesheet" href="tzy.css" type="text/css">
</head>
<body>
<p>测试能否被继承</p>
<h2>啦啦啦啦啦啦啦啦</h2>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
<p>测试能否被继承</p>
</body>
</html>






 






body {
    background: blue;
    /*背景颜色,不能被继承*/
    background-image: url("http://mpic.tiankong.com/125/4a0/1254a004e301cef092bbb4259655e309/640.jpg");
    /*设置图片*/
    width: 900px;
    height: 900px;
    background-size: 500px 500px;
    /*设置图片大小*/
    background-repeat: no-repeat;
    /*设置图片不允许重复*/
    background-attachment: fixed;
    /*设置滚动页面的时候图片不滚动*/

}

p {
    width: 150px;
    height: 20px;
    background: red;
}

h2 {
    background-image: url("http://mpic.tiankong.com/125/4a0/1254a004e301cef092bbb4259655e309/640.jpg");
    /*设置图片*/

    background-repeat: repeat;
    /*设置图片允许重复(默认)*/
    background-repeat: repeat-x;
    /*设置图片X轴可以重复*/
    background-repeat: repeat-y;
    /*设置图片y轴可以重复*/
    background-repeat: no-repeat;
    /*设置图片不允许重复*/
    background-position: right center;
    /*设置图片起始位置可以写入 100px 100px*/

}


												


											
HTML学习笔记 CSS背景样式案例 第六节 （原创） 参考使用表的更多相关文章
	

    
								
  1. [CSS3]学习笔记-CSS基本样式讲解
		
    1.CSS样式-背景 CSS运行应用纯色作背景,也允许使用背景图像创建相当复杂的效果 <!DOCTYPE html> <html> <head lang="en ...
    
		
    2. 
						
  2. CSS学习笔记——CSS选择器样式总结
		
    <style type="text/css"> * { padding:0; margin:0; } .box h2 { //内边距左边的距离 padding-left ...
    
		
    3. 
						
  3. JAVAscript学习笔记 js计时器与倒计时 第六节 （原创） 参考js使用表
		
    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
    
		
    4. 
						
  4. amazeui学习笔记--css（基本样式4）--打印样式Print
		
    amazeui学习笔记--css(基本样式3)--打印样式Print 一.总结 1.打印显示url方法: 利用 CSS3 content 属性,将 <a> 和 <abbr> 的 ...
    
		
    5. 
						
  5. amazeui学习笔记--css（基本样式3）--文字排版Typography
		
    amazeui学习笔记--css(基本样式3)--文字排版Typography 一.总结 1.字体:amaze默认非 衬线字体(sans-serif) 2.引用块blockquote和定义列表:引用块 ...
    
		
    6. 
						
  6. amazeui学习笔记--css（基本样式2）--基础设置Base
		
    amazeui学习笔记--css(基本样式2)--基础设置Base 一.总结 1.盒子模型:外margin,内padding,这里的内外指的边框 2.border-box:Amaze UI 将所有元素 ...
    
		
    7. 
						
  7. amazeui学习笔记--css（基本样式）--样式统一Normalize
		
    amazeui学习笔记--css(基本样式)--样式统一Normalize 一.总结 1.统一浏览器默认样式: Amaze UI 也使用了 normalize.css,就是让不同浏览器显示相同的样式  ...
    
		
    8. 
						
  8. amazeui学习笔记--css（常用组件10）--导航条Topbar
		
    amazeui学习笔记--css(常用组件10)--导航条Topbar 一.总结 1. 导航条:就是页面最顶端的导航条:在容器上添加 .am-topbar class,然后按照示例组织所需内容.< ...
    
		
    9. 
						
  9. amazeui学习笔记--css（布局相关3）--辅助类Utility
		
    amazeui学习笔记--css(布局相关3)--辅助类Utility 一.总结 1.元素清除浮动: 添加 am-cf 这个 class 即可 2.水平滚动: .am-scrollable-horiz ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. C++ 虚函数 、纯虚函数、接口的实用方法和意义
			
    也许之前我很少写代码,更很少写面向对象的代码,即使有写多半也很容易写回到面向过程的老路上去.在写面向过程的代码的时候,根本不管什么函数重载和覆盖,想到要什么功能就变得法子的换个函数名字,心里想想:反正 ...
    
			
    2. 
						
  2. Huge Mission
			
    Huge Mission Problem Description Oaiei is busy working with his graduation design recently. If he ca ...
    
			
    3. 
						
  3. windows下创建Python虚拟环境
			
    windows下创建Python虚拟环境 说明 由于Python的版本众多,还有Python2和Python3的争论,因此有些软件包或第三方库就容易出现版本不兼容的问题. 通过 virtualenv  ...
    
			
    4. 
						
  4. Ubuntu 16.04 源码编译安装PHP7
			
    一.下载PHP7的最新版源码 php7.0.9  下载地址 http://php.net/get/php-7.0.9.tar.gz/from/a/mirror 二.解压 tar -zxf /tmp/p ...
    
			
    5. 
						
  5. FPGA在电平接口领域的应用
			
    电子技术的发展,产生了各种各样的电平接口. TTL电平: TTL电平信号之所以被广泛使用,原因是因为:通常我们采用二进制来表示数据.而且规定,+5V等价于逻辑"1",0V等价于逻辑 ...
    
			
    6. 
						
  6. JavaScript面向对象(OOP)
			
      前  言 JRedu 面向对象程序设计(简称OOP)是现在最流行的程序设计方法,这种方法有别于基于过程的程序设计方法.在写面向对象的WEB应用程序方面JavaScript是一种很好的选择.它能支持 ...
    
			
    7. 
						
  7. mongodb生产环境(副本集模式)集群搭建配置
			
    mongodb副本集模式由如下几部分组成: 1.路由实例mongos 2.配置实例configsvr 3.副本集集群replset(一主多从) tips: 1.以上实例都是mongod守护进程 2.以 ...
    
			
    8. 
						
  8. asp.net mvc CodeFirst模式数据库迁移步骤
			
    利用Code First模式构建好基本的类后,项目也开始搭建完毕并成功运行,而且已经将数据库表结构自动生成了. 但是,我有新的类要加入,有字段需要修改,那怎么办呢,删库,跑路 ?  哈哈 利用数据库迁 ...
    
			
    9. 
						
  9. JQuery自定义插件详解之Banner图滚动插件
			
      前  言 JRedu JQuery是什么相信已经不需要详细介绍了.作为时下最火的JS库之一,JQuery将其"Write Less,Do More!"的口号发挥的极致.而帮助J ...
    
			
    10. 
						
  10. JAVA中子类会不会继承父类的构造方法
			
    声明:刚刚接触java不久,如果理解有错误或偏差望各位大佬强势批判 java中子类能继承父类的构造方法吗? 父类代码: class Father { String name ; //就不set/get ...
    
			
    11.