废话不多说上代码：

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. Xamarin.Android中实现延迟跳转

    http://blog.csdn.net/candlewu/article/details/52953228 方法一: 使用Handler().PostDelayed 延迟启动 new Handler ...

  2. UWP 手绘视频创作工具技术分享系列 - 有 AI 的手绘视频

    AI(Artificial Intelligence)正在不断的改变着各个行业的形态和人们的生活方式,图像识别.语音识别.自然语言理解等 AI 技术正在自动驾驶.智能机器人.人脸识别.智能助理等领域中 ...

  3. vue2.0笔记《二》组件

    主要内容:如何注册组件.如何使用组件.父组件子组件之间值的传递 1.如何注册组件 第一步:通过import将子组件载入父组件的js中 // 第一步:通过import将子组件载入父组件的js中 impo ...

  4. Python正则表达式返回首次匹配到的字符及查询的健壮性

    re.findall(pattern,string)会搜索所有匹配的字符,返回的是一个列表,获取首个匹配需要re.findall(pattern,string)[0]访问, 但是如果findall没匹 ...

  5. vmvare centos 7.0 root密码忘记后重置及总结

    今天遇到了一个比较尴尬的事情,我centos 7.0的虚拟机密码忘了.....里面还有我配置好的环境呢.于是我就上网上搜索各种方法,最后经我验证下面这个方法比较靠谱: 使用光盘修复Centos: ht ...

  6. 使用ControllerAdvice注意事项，Ambiguous @ExceptionHandler method mapped for [class org.springframework.web.bind.MethodArgumentNotValidException]

    前言 ControllerAdvice非常好用,可以把系统内部的异常统一处理.用起来也很简单.比如,http://www.cnblogs.com/woshimrf/p/spring-web-400.h ...

  7. append和extend 的区别

    l = ["zhy",666] l.extend(["edit","sdd"]) print(l) #['zhy', 666, 'edit' ...

  8. 利用树莓派实现监控系统二（用motion实现监控）

    终于要开始实现监控啦!ಠ౪ಠ 看起来很简单的步骤,但是过程却无比艰辛,踩坑是最好的成长 (/= _ =)/~┴┴ 第一步,不是安装!而是 update!ㄟ( ▔, ▔ )ㄏ sudo apt-get ...

  9. 2.Text input and output

    文本的输入和输出 输出 要在屏幕上输出文本你需要这样一行代码: print("Hello World") 如果输出多行,要添加符号“\n”: print("Hello W ...

  10. 腾讯windows系统服务器

    今天用腾讯的服务器搭建起了自己的博客,先看主页效果...简单的ui设计,主要就是要上服务器看看.    说说服务器的搭建: 1.卖,进腾讯云,自己对应的买操作系统的就可以的啦.具体的链接: https ...