<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

</head>

<body>

    css和html相结合（div、span、p等等）：<BR />

    1、每个html标签中都有一个style样式属性，该属性的值就是css代码，每个代码之间用";"隔开

    <BR />

    <div style="background-color:#00C; color:#6C9">同样div定义01次，复用性差</div>

    <BR />

    <div style="background-color:#00C; color:#6C9">同样div定义02次，复用性差</div>

    <BR />

    2、使用style标签方式，style样式，应放在head标签中，表明页面在加载时，就加载样式

    <BR />

    <style type="text/css">

        div{

            background-color:#000;

            color:#FFF

            }

    </style>

    <div>同样div<bR />定义整体样式01次，复用好差</div>

    <BR />

    <span style="background-color:#000; color:#09C">span：区域：局部定义</span>

    <BR />

    <style type="text/css">

        span{

             background-color:#C93;

             color:#0F0

            }

    </style>

    <span>span：区域：整体部定义</span>

    

    <BR />

    <p style="background-color:#900; color:#6FF">

        p：段落同样可以定义css样式

    </p>

</body>

</html>

分别定义了div层的样式，span区域的样式，p段的样式。

可以定义局部的，可以定义全局的。全局的样式定义最好在head标签中定义，表明页面一加载就加载样式。

CSS_01_css和html的结合1、2的更多相关文章

  1. CSS_01_CSS和html结合的方式3、4

    第01步:编写第01个css样式:div.css @charset "utf-8"; /*第01步:定义div:背景色.字体颜色*/ div{ background-color:# ...

随机推荐

  1. nrf51822裸机教程-RTC

    RTC0被协议栈使用了.所以在跑蓝牙程序的情况下.RTC0不能使用. RTC相关寄存器如下: EVTEN,EVTENSET,EVTENCLR. 这三个寄存器用来设置是否使能某个事件.(TICK,OVR ...

  2. ssh2 php扩展

    如何通过PHP启动和关闭远程服务器上的某个软件,譬如Memcached.对于俺这个刚刚掌握PHP编程皮毛的菜鸟来说,最直接不过的想法就是用exec函数执行SSH命令呗,先把运行Apache+PHP的服 ...

  3. EF6 CodeFirst 启用Migration，常用命令

    Enable-Migrations –EnableAutomaticMigrationsAdd-Migration [MigrationName] [-Force]Update-Database –T ...

  4. JS之toString方法

    1.JS中几乎每个值都有toString方法,null和undefined除外 2.对于字符串形式的值也可以使用toString()方法,返回该字符串的一个副本 3.toString(radix)方法 ...

  5. 不允许修改SQLserver2008r2表中字段的属性问题

    SQLserver2008r2修改表中字段的属性时弹出 点击工具->选项,取消阻止保存要求重新创建表的更改

  6. Selenium2学习-025-WebUI自动化实战实例-023-页面快照截图应用之一 -- 常规截图（全页面）

    通常我们在进行自动化测试的过程中,有时候需要对页面进行截图,以保存此时的页面,用作后续的判断或测试报告.在 Web UI 自动化测试脚本过程中,通常有以下几种截图的要求: 常规截图 - 页面样式(全页 ...

  7. 【转】Android Paint之 setXfermode PorterDuffXfermode 讲解

    [置顶] Android Paint之 setXfermode PorterDuffXfermode 讲解 分类: android动效篇2015-04-07 17:23 978人阅读 评论(8) 收藏 ...

  8. 【转】关于Android资源文件中出现百分号的问题

    关于Android资源文件中出现百分号的问题 分类: Android JAVA2014-08-01 16:53 1345人阅读 评论(0) 收藏 举报 ANDROID格式化资源文件   目录(?)[+ ...

  9. 通往成功的钥匙--Web前端开发技术

    互联网是一个服务性行业,用户对网站良好的体验度,直接影响到网站的效果.无论你做了多少广告推广,没有用户体验度等于零.Web前端技术是为了解决用户体验度而诞生的.无论是百度.新浪.阿里巴巴等大型网站,还 ...

  10. 复合事件ready,hover,toggle

    1.ready 2.hover 3.toggle(fn1,fn2, …)(被废弃) 2.hover(fn(){……},fn(){……}) 特别强调一点,hover的是mouseenter和mousel ...