怎么用css定义部分背景颜色

html-css011

怎么用css定义部分背景颜色,第1张

需要准备的材料分别有:电脑、浏览器、html编辑器。

1、首先,打开html编辑器,新建html文件,例如:index.html。

2、在index.html中的<style>标签中,输入css代码:div{background-color: #0b93d5}。

3、浏览器运行index.html页面,此时成功实现了只在文字的后面又蓝色背景色。

步骤如下:

1、首先打开电脑上自带的记事本程序,然后输入html网页基本结构语句。<html><body></body></html>

2、由于css样式必须在标签<head></head>之间,因此我们点击<html>后面,输入<head></head>标签。

3、在head标签之间输入样式标签<style></style>,然后定义一些属性,例如

<style type="text/css">

body {background-color: yellow} 定义网页背景色为黄色;

h1 {background-color: #00ff00} 定义h1标签背景色为#00ff00;

h2 {background-color: transparent} 定义h2标签背景色为透明;

p {background-color: rgb(250,0,255)} 定义p标签背景色为rgb值;

p.no2 {background-color: graypadding: 20px} 这个定义class属性为no2的p标签背景色为灰色,并且边距为20px;

</style>

4、然后点击body标签后面输入正文标签内容,例如

<h1>这是KING</h1>

<h2>这是KING</h2>

<p>这是KING</p>

<p class="no2">这个KING设置20内边距。</p>

5、点击记事本菜单中的文件,选择另存为,把内容保存为html网页格式。双击打开预览效果。6、我们可以发现代码中两个同样的<p>标签显示的css样式却不同,区别就在于样式中定义的p.no2,这就是正文代码中class="no2"的优势所在,可以定义个性风格。

定义和用法

background 简写属性在一个声明中设置所有的背景属性。

可以设置如下属性:

background-color

background-position

background-size

background-repeat

background-origin

background-clip

background-attachment

background-image

如果不设置其中的某个值,也不会出问题,比如 background:#ff0000 url('smiley.gif')也是允许的。

通常建议使用这个属性,而不是分别使用单个属性,因为这个属性在较老的浏览器中能够得到更好的支持,而且需要键入的字母也更少。

默认值:

not specified    

继承性:

no    

版本:

CSS1 + CSS3    

JavaScript 语法:

object.style.background="white url(paper.gif) repeat-y"    

实例

如何在一个声明中设置所有背景属性:

body

 {

 background: #00FF00 url(bgimage.gif) no-repeat fixed top

 }