html--css背景-小闹腾-ChinaUnix博客

Chinaunix首页 | 论坛 | 博客

首页　| 　博文目录　| 　关于我

博客访问： 314862
博文数量： 69
博客积分： 0
博客等级：民兵
技术积分： 759
用户组：普通用户
注册时间： 2014-09-09 14:15

个人简介

〆人生就是拼命地奔跑，和华丽的跌倒。つ

文章分类

全部博文（69）

JavaScript（7）
3DsMax（1）
Java（2）
MYSQL数据库（1）
ps（0）
linux-C库函数中（5）
html（11）
php（2）
计算机基础（2）
单片机（3）
linux（3）
电路分析（2）
c语言的基础（28）
未分配的博文（2）

文章存档

2017年（2）

2016年（16）

2015年（21）

2014年（30）

我的朋友

最近访客

推荐博文

html--css背景

分类： Html/Css

2015-05-31 12:10:01

1.设置页面的背景颜色
源代码：

点击(此处)折叠或打开

<!DOCTYPE html>

<title>css背景</title>
<style type="text/css">
body
{
background-color:#9c6;
}
</style>
</head>
<body>
<h1>这是css网页<h1>
<p>欢迎进入</p>
</body>
</html>

运行结果：

2.设置不同元素的背景颜色
源代码：

点击(此处)折叠或打开

<!DOCTYPE html>
<title>css背景</title>
<style type="text/css">
body
{
background-color:#C9F;
}
h1
{
background-color:#99F;
}
p
{
background-color:#FC9;
}
div
{
background-color:#FF9;
}
</style>
</head>
<body>
<h1>这是css网页<h1>
<div>
在div中
<p>欢迎进入</p>
仍然在div中
</div>
</body>
</html>

运行结果：

3.设置一个图像作为页面背景
源代码：

点击(此处)折叠或打开

<!DOCTYPE html>
<html>
<head>
<title>css背景</title>
<style type="text/css">
body
{
background-image:url('哈哈.jpg');
}
</style>
</head>
<body>
<p>欢迎进入</p>
</body>
</html>

运行结果：

4. 在水平方向重复页面图像背景
源代码：

点击(此处)折叠或打开

<!DOCTYPE html>
<html>
<head>
<title>无标题文档</title>
</head>
<style type="text/css">
body
{
background-image:url('蓝天.jpg');
background-repeat:repeat-x;
}
</style>
</head>
<body>
<h1>欢迎进入</h1>
</body>
</html>

运行结果：

5.定位背景图像
源代码：

点击(此处)折叠或打开

<!DOCTYPE html>
<html>
<head>
<title>无标题文档</title>
</head>
<style type="text/css">
body
{
background-image:url('哈哈.jpg');
background-repeat:no-repeat;
background-position:left top;
margin-left:200px;
}
</style>
</head>
<body>
<h1>欢迎进入</h1>
</body>
</html>

运行结果：

6.固定背景图片
源代码：

点击(此处)折叠或打开

运行结果：

阅读(1744) | 评论(0) | 转发(0) |

0

上一篇：HTML--申请表

下一篇：MY-SQL数据库--初入门

给主人留下些什么吧！~~

关于我们 | 关于IT168 | 联系方式 | 广告合作 | 法律声明 | 免费注册

Copyright 2001-2010 ChinaUnix.net All Rights Reserved 北京皓辰网域网络信息技术有限公司. 版权所有

感谢所有关心和支持过ChinaUnix的朋友们