废话不多说上代码:

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. Ubuntu安装微信

    1.系统是Ubuntu 16.04 64位系统,在网上先去下载electronic-wechat-Linux         https://github.com/geeeeeeeeek/electr ...

  2. Django_调查问卷

    1.问卷的保存按钮 前端通过ajax把数据发过来后端处理数据,然后返回给前端2.对问卷做答 首先用户进行登录,验证 条件:1.只有本班的学生才能对问卷做答      2.已经参加过的不能再次访问   ...

  3. CHECKDB内部:什么是BlobEater?

    DBCC CHECKDB注意到有关数据文件页面.一旦整个表的所有页(或一组表,如果配料已启用-看到同样的博客文章我上面提到的),所有的事实都聚集在一起,他们都应该相互抵消.当有额外的事实(在索引B树都 ...

  4. node.js 之 Hello,World in Node !

    创建一个js文件,把下面的内容粘贴进去,命名为helloworld.js. //加载 http 模块 var http = require("http"); //创建 http 服 ...

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

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

  6. C#中的异步学习

    C#中的异步 C#5.0版本发布有一个"主题那就是异步编程. 我们先创建一个windowForm窗体,实现下面效果,然后我们通过简单的案例对比同步和异步: 首先我们编写一个耗时方法: /// ...

  7. Adobe Acrobat pro生成PDF模版

    最近做了一个关于动态生成PDF合同的需求  java生成PDF 网络上随便一搜遍有了 不要用手动在代码里面输入合同中的文字这种方式 如这样的方式 http://blog.csdn.net/justin ...

  8. ABP Zero 本地化语言的初始化和扩展

    在aspnetboilerplate.com生成后,在core下的本地化文件增加选项即可 初始化方法 解析: var currentCultureName = Thread.CurrentThread ...

  9. jdbc+servlet+jsp实现登录验证

    基础知识准备:sql的增删改查. 新增:insert into 表名称(字段名.....)values(字段名....). 修改:update 表名称 set  字段名="新值" ...

  10. SQLAlchemy框架用法详解

    介绍 SQLAlchemy是一个基于Python实现的ORM框架.该框架建立在 DBAPI之上,使用关系对象映射进行数据库操作,简言之便是:将类和对象转换成SQL,然后使用数据API执行SQL并获取执 ...