样式表:

一、样式表的概念:CSS(Cascading Style Sheets)层叠式样式表,作用是美化HTML网页。

二、样式表的分类:样式表分内联式样式表、内嵌式样式表和外部样式表三种。

1、内联式样式表:A、写在标签里面 。

B、style="样式" 例如:<div style="height:200px;"></div>

C、控制精确,样式优先级最高,但是代码重用性差。

2、内嵌式样式表:A、作为一个独立的区域内嵌在网页里,必须写在head标签里面。<style type="text/css">样式</style>

B、控制没有内联的精确,样式优先级第二,代码重用性好。

3、外部样式表:A、新建一个CSS文件,用来放样式表,如果要在HTML文件中调用样式表,一般用<link href="test.css" rel="stylesheet" />

B、控制没有内联的精确,样式优先级最低,代码重用性最好。

选择器:

选择器是样式表用来选择元素的。

选择器分为四种:标签选择器、Class 选择器、ID选择器、复合选择器。

1、标签选择器:A、用标签名做选择器。

B、优先级最低。

例如:<style type="text/css>

p{

样式:

}

</style>

注:格式对P标签起作用。

2、Class选择器:A、根据Class名来筛选元素,都是以"."开头。

B、优先级排名第二。

例如:<head>

<style type="text/css>

.aaa{

样式:

}

</style>

</head>

<body>

<div class="aaa"></div>

</body>

3、ID选择器:A、根据ID名来筛选出唯一元素,都是以"#"开头。

B、优先级最高。

例如:

<head>

<style type="text/css>

#aaa{

样式:

}

</style>

</head>

<body>

<div id="aaa"></div>

</body>

4、复合选择器:

(1)逗号并列:用","隔开,表示并列。

例如:<style type="text/css>

p,span{

样式:

}

</style>

注:格式对P标签和span标签起作用。

(2)空格后代:用空格隔开,表示后代。

例如:<style type="text/css>

.p .span{

样式:

}

</style>

注:找到使用样式p的标签,在该标签里面span标签使用该样式。

(3)用"."筛选:用"."表示筛选。

例如:<style type="text/css>

p.span{

样式:

}

</style>

注:在p标签中的class="span"的标签,使用此样式。

2017-3-25 css样式表(一)的更多相关文章

  1. WEB入门三 CSS样式表基础

    学习内容 Ø        CSS的基本语法 Ø        CSS选择器 Ø        常见的CSS样式 Ø        网页中3种使用CSS的方式 能力目标 Ø        理解CSS的 ...

  2. 深度理解CSS样式表,内有彩蛋....

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

  3. CSS样式表

    CSS样式及属性 样式标的基本概念 样式表的分类 1.内联样式表 和html联合显示,控制精确,但可重用性差,冗余多. 例:<p style="font-size:14px;" ...

  4. JS 控制CSS样式表

    JS控制CSS所使用的方法: <style> .rule{ display: none; } </style> 你想要改变把他的display属性由none改为inline.  ...

  5. HTML基础(三)——css样式表

    CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. /*注释区域*/此为注释语法 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控制精确, ...

  6. DOM与CSS样式表

    在前文 <DOM与元素节点内联样式>中我们了解了用 DOM 提供的接口操作元素节点内联样式的方法,今天我们来学习一下如何用 DOM 操作 CSS 样式表. CSS 样式表概况 通过使用 H ...

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

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

  8. CSS样式表继承详解

    最近在恶补css样式表的基础知识.上次研究了css样式表之冲突问题详解 .这次是对 css 继承 特性的学习. 什么是css 继承?要想了解css样式表的继承,我们先从文档树(HTML DOM)开始. ...

  9. 2016年10月27日--css样式表

    CSS样式表 样式表分类 1.内联样式表 和html联合显示,控制精确,但是可重用性差,冗余多. !doctype html> <html> <head> <met ...

  10. CSS样式表 选择器

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

随机推荐

  1. oracle_权限

    Oracle 权限 权限允许用户访问属于其它用户的对象或执行程序,ORACLE系统提供三种权限:Object 对象级.System 系统级.Role 角色级.这些权限可以授予给用户.特殊用户publi ...

  2. 笑谈ArcToolbox (1) ArcToolbox 的发展方向

    笑谈ArcToolbox (1) ArcToolbox 的发展方向 by 李远祥 ArcGIS工具箱ArcToolbox具有非常多的工具,相信用过的人都非常惊叹,其功能完备并且强大,种类繁多,总能找到 ...

  3. ArcGIS制图表达Representation-制图表达原理

    ArcGIS制图表达技术-制图表达原理 by 李远祥 在讲述原理之前,需要对上一章内容进行一些必要的补充说明.既然制图表达有很多优势,是不是什么情况下都可以使用制图表达技术呢?如果有以下的一些特殊的要 ...

  4. 面试之MySQL基本命令

    既然要操作数据库就从数据库链接写起,包括建库.建表.增删该查字段及约束,删库,删表的数据,以下主要是对我以往面试的总结,欢迎补充! 一.数据库连接 1.连接本机(p和密码123456之间无空格) my ...

  5. Linux驱动技术(七) _内核定时器与延迟工作

    内核定时器 软件上的定时器最终要依靠硬件时钟来实现,简单的说,内核会在时钟中断发生后检测各个注册到内核的定时器是否到期,如果到期,就回调相应的注册函数,将其作为中断底半部来执行.实际上,时钟中断处理程 ...

  6. Js 跨域CORS报错 Response for preflight has invalid HTTP status code 405

    问题 公司项目H5调用接口遇到Response for preflight has invalid HTTP status code 405这样的错误,是使用PUT方式提交请求接口.Content-T ...

  7. HashTable源码分析

      本次分析代码为JDK1.8中HashTable代码.   HashTable不允许null作为key和value.   HashTable中的方法为同步的,所以HashTable是线程安全的. E ...

  8. shell-早间学习,每日一点-5

    http://www.cnblogs.com/liuling/p/2013-8-4-01.htmlhttp://www.cnblogs.com/stephen-liu74/category/32665 ...

  9. Java重写equals()和hashCode()

    1.何时需要重写equals() 当一个类有自己特有的 ”逻辑相等”概念(不同于对象身份的概念). 2.设计equals() [1]使用instanceof操作符检查 ”实参是否为正确的类型”. [2 ...

  10. 多线程简介及GCD的使用

    多线程简介: 对于任意一个iOS应用,程序运行起来后,默认会产生一个主线程(MainThread),主线程专门用来处理UIKit对象的操作,如界面的显示与更新.处理用户事件触发的操作等等.(记忆这点, ...