<1.内联样式,优点:控制精确,缺点:代码重用性差,页面代码乱。>

<div style="background-color:#0F0"></div>

<2.内嵌样式,优点:代码重用性好。缺点:控制不精确,写在<head>标签里面>

<style type="text/css">
*{
color:#0F3
}<!--*代表给所有内容改样式-->

</style>

<3.外部样式,优点:可以对多个页面,多个标签内容进行改样式;缺点:控制最不精确,新建一个css>

<link href="file:///D|/实训资料/自我练习/新建文件夹/Untitled-5.css" rel="stylesheet" type="text/css" />

样式的格式:
样式名:样式的值
多个样式之间,用;隔开。

 

选择器

1.*选择器

<style type="text/css">
*{
color:#0F3
   }<!--*代表给所有内容改样式-->

</style>

2.id选择器(精确控制)"#"

<head>

<style>
#aa{
color:#0C6}

</style>

</head>

<body>

<div id="aa">精确控制</div>

</body>

3.class选择器,用“.”

<head>

<style>
.a1{
color:#}

</style>

</head>

<body>
<div class="a1">这是第一个</div>
<div class="a1">这是第二个</div>
<div class="a1">这是第三个</div>
<div class="a1">这是第四个</div>
<div class="a1">这是第五个</div>

 </body>

 

4.标签选择器

<head>

<style>
div{
color:#}
</style>

</head>

<body>

<div></div>

</body>

5.复合选择器

(1)“,”代表并列

<style>
div,span{
    color:#F00}

</style>

</head>

<body>

<div>测试一</div>
<span>测试二</span>

(2)“空格”表示后代

<head>

<style>
#u1 li{
color:#F00}

</style>

</head>

<body>
<ul id="u1">
<li>第一</li>
<li>第二</li>
<li>第三</li>
</ul>

<body>

(3)“.”  标签选择含有class的

<head>

<style>
div.c1{ <-- div标签里的有class=“c1”的。 -->
color:#0F3}
</style>

</head>

<body>

<div class="c1"></div>
<div class="c1"></div>
<div class="c1"></div>
<div class="c1"></div>
<span class="c1"></span>

 </body>

<!--内联的样式,优先级最高。内嵌其次。
内联,内嵌同时控制一部分内容,以内联为准。-->

<!-- 选择器的优先级,-->
标签选择器的优先级大于*选择器
class选择器优先级大于标签选择器
id选择器优先级大于class选择器

html部分---样式表,选择器;的更多相关文章

  1. CSS样式表 选择器

    1.内联样式表 和HTML联合显示,控制精确,但是可重用性差,冗余较多. 例:<p style="font-size:14px;">内联样式表</p> &l ...

  2. Html 初识样式表&选择器

    样式表&类选择器分类 样式表分类: 1.内联式样式表:在标签内部写样式代码,精确但不方便,增加工作量,后期修改麻烦. 2.嵌入式样式表:一般写在head内 以<style>.... ...

  3. Qt样式表——选择器详解(父子关系)

    在上一节中,小豆君给大家介绍了样式表的基本概念和大致用法.今天我们来详细了解下样式表中选择器的用法. 所谓选择器,就是指定你所设置的样式对哪个或哪些控件起作用. 到目前为止,Qt样式表支持CSS2中定 ...

  4. PHP初入,基础知识点整理(样式表&选择器的使用整理)

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...

  5. 4、网页制作Dreamweaver(样式表CSS)

    样式表style 制作一个风格统一的网页,需要样式表对颜色.字体等属性的规范,同时也省去在body中多次定义的麻烦,所以一个样式表是必不可少的. 样式表有两种引用的方法:一种是直接写在html的< ...

  6. CSS:CSS样式表及选择器优先级总结

    我们在写网页的时候经常会遇到同一个HTML文件,使用了外部样式.内部样式以及内联样式,那么如果发生冲突时浏览器是怎么抉择的呢? 也会遇到这样的情况,在样式表中,对同一个HTML元素,我们有可能既用到了 ...

  7. css样式表分类、选择器分类、css基础样式

    1 . 样式表  Cascading Style Sheet      css优势: 内容与表现分离 网页的表现统一,容易修改 丰富的样式,使网页布局更加灵活 减少网页代码量,增加网页的浏览速度,节省 ...

  8. CSS样式----图文详解:css样式表和选择器

    主要内容 CSS概述 CSS和HTML结合的三种方式:行内样式表.内嵌样式表.外部样式表 CSS四种基本选择器:标签选择器.类选择器.ID选择器.通用选择器 CSS三种扩展选择器:组合选择器.后代选择 ...

  9. 一起学HTML基础-CSS样式表-基本概念、分类、选择器

    一.基本概念: CSS  (Cascading Style Sheets)层叠样式表,是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言. ...

  10. css样式表和选择器的优先级以及position元素属性值的区别

    css样式表优先级 问题:当同一个HTML元素被不止一个样式定义时,会使用哪个样式呢? 答:一般而言,所有的样式会根据下面的规则层叠于一个新的虚拟样式表中,其中数字4拥有最高的优先权. 1.浏览器缺省 ...

随机推荐

  1. ubuntu 12.04内核升级到3.13.1

    1.背景:今天上午连接Android调试之后,突然又出现了无法识别usb的问题.具体表现为:除usb无线网卡有效外,其他usb设备包括usb鼠标.u盘.android手机插上后都没反应.dmesg一直 ...

  2. Java中的深拷贝和浅拷贝

    1.浅拷贝与深拷贝概念 (1)浅拷贝(浅克隆) 浅拷贝又叫浅复制,将对象中的所有字段复制到新的对象(副本)中.其中,值类型字段(java中8中原始类型)的值被复制到副本中后,在副本中的修改不会影响到源 ...

  3. mysql数据库 安装 (原创)

    1.首先下载mysql 数据库,我安装的是mysql5.1版本,直接安装就行,但是如果以后你想在数据库里显示中文的话,要把字符集设置为gb2312 2.配置数据源odbc.  mysql-connec ...

  4. Chrome 开发者工具有了设备模拟器

    今天从哥们那里学到了一个小技巧,使用chrome自带的多设备模拟器来调试页面在不同设备下的显示效果. 特地上网查了一下,记录一下. 如果想要在 Chrome 上测试网站在不同设备,不同分辨率的显示情况 ...

  5. String字符串包含运算符实现运算

    string aa = "(1+2)/3+(3+4)*5"; DataTable dt = new DataTable(); string b = dt.Compute(aa, & ...

  6. UTF-8 有BOM和无BOM

    BOM(byte order mark)是为 UTF-16 和 UTF-32 准备的,用于标记字节序(byte order).微软在 UTF-8 中使用 BOM 是因为这样可以把 UTF-8 和 AS ...

  7. iOS - CADisplayLink与NSTimer

    一.CADisplayLink简介 CADisplayLink 是一个定时器对象可以让你的应用以与显示器的刷新界面相同的频率进行绘图. 应用如果想要创建 display link ,需要提供一个目标对 ...

  8. bjui简单了解

    bjui官网:http://demo.b-jui.com/ 其他的我就不是很了解,恶心.

  9. hql语句理解2

    /* * this.getSession().createQuery("sdfdf").executeUpdate();这里面的query可以是delete,update,inse ...

  10. arguments.callee

    arguments.callee在哪个函数中运行,他就代表哪个函数,一般在匿名函数中.在匿名函数中有时需要自己调用自己,但是由于是匿名函数,没有名字,所以可以用arguments.callee来代替匿 ...