代码

<html>
<head>
<title>全局声明</title>
<style type="text/css">
*{ /* 全局声明 */
color:purple; /* 文字颜色 */
font-size:15px; /* 字体大小 */
}
h2.special, .special, #one{ /* 集体声明 */
text-decoration:underline; /* 下划线 */
}
</style>
</head>
<body>
<h1>全局声明h1</h1>
<h2 class="special">全局声明h2</h2>
<h3>全局声明h3</h3>
<h4>全局声明h4</h4>
<h5>全局声明h5</h5>
<p>全局声明p1</p>
<p class="special">全局声明p2</p>
<p id="one">全局声明p3</p>
</body>
</html>

说明:

全局声明之后,h1、h2、h3的大小都变成了15px

代码

<html>
<head>
<title>全局声明</title>
<style type="text/css">
body{ /* 全局声明 */
color:purple; /* 文字颜色 */
font-size:15px; /* 字体大小 */
}
h2.special, .special, #one{ /* 集体声明 */
text-decoration:underline; /* 下划线 */
}
</style>
</head>
<body>
<h1>全局声明h1</h1>
<h2 class="special">全局声明h2</h2>
<h3>全局声明h3</h3>
<h4>全局声明h4</h4>
<h5>全局声明h5</h5>
<p>全局声明p1</p>
<p class="special">全局声明p2</p>
<p id="one">全局声明p3</p>
</body>
</html>

说明

body声明之后,下面继承的元素,又会改变样式,比如h1、h2、h3等等,会在此基础上,加上h1、h2、h3的样式

代码

<html>
<head>
<title>全局声明</title>
<style type="text/css">
*{ /* 全局声明 */
color:purple; /* 文字颜色 */
font-size:15px; /* 字体大小 */
}
h2.special, .special, #one{ /* 集体声明 */
text-decoration:underline; /* 下划线 */
color:red; /* 文字颜色 */
font-size:30px;
}
</style>
</head>
<body>
<h1>全局声明h1</h1>
<h2 class="special">全局声明h2</h2>
<h3>全局声明h3</h3>
<h4>全局声明h4</h4>
<h5>全局声明h5</h5>
<p>全局声明p1</p>
<p class="special">全局声明p2</p>
<p id="one">全局声明p3</p>
</body>
</html>

说明

*之后,执行class,会覆盖掉*的样式,指定元素后的class会继续覆盖class下的样式

暂时理解到这

css案例学习之全局声明*{} 与body{}的区别的更多相关文章

  1. CSS全局声明*与body的区别

    通常在写CSS前,为了保证兼容性及展示效果的一致,先会清除浏览器默认样式.此时有两种用法比较常用:1.*{};  2.body{}; 之前我比较偏好于用*{},比较便于把控样式的设置.一直也没试过bo ...

  2. css案例学习之table tr th td ul li实现日历

    效果 代码 <html> <head> <title>Calendar</title> <style> <!-- .month { b ...

  3. css案例学习之盒子模型

    定义:每个盒子都有:边界.边框.填充.内容四个属性: 每个属性都包括四个部分:上.右.下.左:这四部分可同时设置,也可分别设置:里的抗震辅料厚度,而边框有大小和颜色之分,我们又可以理解为生活中所见盒子 ...

  4. css案例学习之继承关系

    代码 <html> <head> <title>继承关系</title> <style> body{ color:blue; /* 颜色 * ...

  5. css案例学习之并集选择器

    代码 <html> <head> <title>并集选择器</title> <style type="text/css"> ...

  6. CSS 案例学习

    1.样式 display:inline-block;可改变a标签,合其可定义宽高 2.a:hover表示鼠标经过 3.background:url(110.png) bottom 表示:给链接一个图片 ...

  7. css案例学习之用thead、tbody、tfoot实现漂亮的table布局

    首先说说thead.tbody.tfoot <thead> <tbody> <tfoot> 无论前后顺序如何改变, <thead> 内的元素总是在表的最 ...

  8. css案例学习之ul li dl dt dd实现二级菜单

    效果 代码实现 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www ...

  9. css案例学习之按钮超链接

    效果 css实现 <html> <head> <title>按钮超链接</title> <style> a{ /* 统一设置所有样式 */ ...

随机推荐

  1. Mysql讲解数据库并发控制知识

    1.下载Mysql并安装,我喜欢不用安装的zip版,cd到bin目录下,先修改下mysql的密码. mysqladmin -u root -p password mysql ,第一次运行并修改mysq ...

  2. Basic knowledge of html (keep for myself)

    1. 通常标签 <strong> 替换加粗标签 <b> 来使用, <em> 替换 <i>标签使用. 2. 在 <head>元素中你可以插入脚 ...

  3. FPGA笔记-读取.dat文件

    读取.dat图像文件 .dat文件是matlab生成的图像文件 initial begin // Initialize Inputs CLK = 0; RST = 1; IMAGE_DATA = 0; ...

  4. 树状dp ural1018

    #include<stdio.h> #include<string.h> #include <iostream> using namespace std; ; in ...

  5. Swift笔记4

    字符 var str = " hello world " var kong = "" 或者 var  kong  = string()   //定义一个空的字符 ...

  6. asp.net 获取IP地理位置的几个主要接口

    腾讯的IP地址API接口地址:http://fw.qq.com/ipaddress 新浪的IP地址查询接口:http://int.dpool.sina.com.cn/iplookup/iplookup ...

  7. SQL Server存储过程和游标有关实例以及相关网址

    内含游标的存储过程实例 第一种写法 GO BEGIN IF (object_id('PT_FAULT_REPORT', 'P') is not null) drop proc PT_FAULT_REP ...

  8. Docker Register安装与基本认证

    准备 基本事项 Docker环境 登录授权方式 镜像存放地址 HTTPS外网访问 启动Docker Registry 1. 基本事项 本篇涉及到的数据文件都放在/data目录下, 其中会有三个子目录 ...

  9. Jenkins部分插件介绍

    1.Join Plugin 功能介绍:这是一个触发job的插件,亮点在于它触发job的条件是等待当前job的所有下游job都完成才会发生. 例:假如A同时触发B1和B2两个下游job,然后配置这个插件 ...

  10. java实现sftp客户端上传文件以及文件夹的功能

    1.依赖的jar文件 jsch-0.1.53.jar 2.登录方式有密码登录,和密匙登录 代码: 主函数: import java.util.Properties; import com.cloudp ...