废话不多说上代码：

1、用CSS给文字添加背景色：

<html>

<head>

<style type="text/css">

body {background-color: yellow}

h1 {background-color: #00ff00}

h2 {background-color: transparent}

p {background-color: rgb(250,0,255)}

p.no2 {background-color: gray; padding: 20px;}

</style>

</head>

<body>

<h1>这是标题 1</h1>

<h2>这是标题 2</h2>

<p>这是段落</p>

<p class="no2">这个段落设置了内边距。</p>

</body>

</html>

2、直接在HTML中用style属性表示：

<html>

<head>

</head>

<body style="background-color:yellow">

<h1 style="background-color:#00ff00">这是标题 1</h1>

<h2 style="background-color: transparent">这是标题 2</h2>

<p style="background-color: rgb(250,0,255)">这是段落</p>

<p style="background-color: gray; padding: 20px;">这个段落设置了内边距。</p>

</body>

</html>

效果如图：

友情提示：

作者：mhq_martin

来源：http://www.cnblogs.com/mhq-martin/

本文版权归作者和博客园共有，欢迎转载，但未经作者允许必须保留此段声明，且在文章页面明显位置给出原文连接，否则保留追究法律责任的权利。

CSS用HTML中的style属性替换的更多相关文章

  1. css样式表中四种属性选择器

    学习此连接的总结http://developer.51cto.com/art/201009/226158.htmcss样式表中四种属性选择器1> 简易属性 tag[class]{ font-we ...

  2. JavaScript 里，$ 代表什么？/JQuery是什么语言？/html中用link标签引入css时的中 rel="stylesheet"属性？/EL表达式是什么？

    JavaScript 里,$ 代表什么? 比如说我写一个mouseover事件: $(document).ready(function(){ $("p").mouseover(fu ...

  3. 修改css样式+jq中的效果+属性操作+元素操作

    :checked    选框选中的 一.修改css样式: 1.参数只写属性名,则返回属性值 $(this).css( ' color ');   //300px 2.参数是属性名,属性值,逗号分隔,是 ...

  4. CSS盒子模型中的Padding属性

    CSS padding 属性 CSS padding 属性定义元素边框与元素内容之间的空白区域,不可见.如果想调整盒子的大小可以调整内容区,内边距,边框. CSS padding 属性定义元素的内边距 ...

  5. css盒子模型中的border属性

        认识border属性 我们可以通过boder属性来为元素设置边框:元素的边框 (border) 是围绕元素内容和内边距的一条或多条线.CSS border 属性允许你规定元素边框的样式.宽度和 ...

  6. CSS在项目中常用的属性总结

    1.媒体查询 2.如何快速生成适配各种浏览器的属性. 3.全面进军移动app开发.

  7. html 样式之style属性的使用

    转自:https://www.ggbiji.com/html-style.html html中的style属性是用来改变html元素的样式的,样式是 在html 4 引入的,它是改变 html元素样式 ...

  8. Android中的 style 和 theme

    通过设置 view 控件的属性,达到设置android UI的目的,如果某些 属性值复用率很高,可以考虑将属性单独声明在 style中,这样就可以达到复用的效果. 一.style Style 概念:A ...

  9. CSS 中关于background 属性功能

    background 是 css中的核心属性,我们对他应该充分了解. background-image   定义背景图像  这个属性是我们用的最多的属性 设置背景图像有两个方式 background: ...

随机推荐

  1. js写基础insertAfter()方法

    //DOM没有提供insertAfter()方法 function insertAfter(newElement, targetElement){ var parent = targetElement ...

  2. C# 使用 CancellationTokenSource 终止线程

    http://blog.csdn.net/hezheqiang/article/details/51966511 我们在多线程中通常使用一个 C# 使用 CancellationTokenSource ...

  3. 砸黑板！ 正则表达式！！！re 模块

    模块是什么? 一个模块就是一个包含了 python 定义和声明的文件,文件名就是模块名字加上.py 的后缀. 但其实 import 加载的模块分为四个通用类别: 1:使用 python 编写的代码(. ...

  4. javascript中对象字面量与数组字面量

    第一部分 我们知道JavaScript中的数据类型有基本数据类型和引用类型,其中Object类型就是非常常用的类型.那么如果创建一个Object类型的实例呢?下面我介绍两种方法: 第一:构造函数法. ...

  5. Python的类与类型

    1.经典类与新式类 在了解Python的类与类型前,需要对Python的经典类(classic classes)与新式类(new-style classes)有个简单的概念. 在Python 2.x及 ...

  6. 带以太网的MicroPython开发板：TPYBoardv201温湿度上传实例

    转载请以链接形式注明文章来源,MicroPythonQQ交流群:157816561,公众号:MicroPython玩家汇 历来关于温湿度的检测都是没有间断过的,这次我们继续检测温湿度,同样还是使用DH ...

  7. 中文版microbit：TurnipBit显示动态滚动字符教程实例

    随着当今社会的发展,社会的进步,家长们越来越忙碌,致使家长们在孩子成长过程中陪孩子的互动的时间越来越少,为此,TurnipSmart公司制作的一款MicroPython开发板--TurnipBit,这 ...

  8. ubuntu16.04+eigen3安装

    Eigen库安装指南(两种方式)1.apt-get方式(假设默认安装到/usr/local/include里,若实际中默认安装到了/usr/include的话,可以对应替换下面命令的相应部分);运行命 ...

  9. python3之xml&ConfigParser&hashlib&Subprocess&logging模块

    1.xml模块 XML 指可扩展标记语言(eXtensible Markup Language),标准通用标记语言的子集,是一种用于标记电子文件使其具有结构性的标记语言. XML 被设计用来传输和存储 ...

  10. 冒泡算法给0~9随机n位数字排序

    <?php //产生5位0~9的随机数      function getRand($begin=0,$end=9,$limit=5){                $rand_array=r ...