一、CSS基本概念:

CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页。

/*注释区域*/    此为注释语法

样式表的分类

1、内联样式表(和html联合显示,控制精确,但是可重用性差,冗余多)

例:<p style="font-size:14px;">内联样式表</p>

以上就是一个简单的内联样式表,用在<body>中的标签中,相当于style附在标签中,只改变该标签p中的样式和格式。

2、内嵌样式表

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

p    //格式对p标签起作用

{ 样式;

}

</style>

这是一个内嵌样式表,就是把<style>样式单独抽出来,放在<head>中,独立控制p标签的样式和格式。

3、外部样式表(显而易见,就是独立于html的文件,但是仍然需要html调用该外部样式表才能发挥其作用)

需要新建一个CSS文件,用来单独存放样式表。当在html中调用此样式表时,需要在html文件右击---CSS样式--附加样式表。当连接成功后,在html文件<head>中会出现<link..>的类似连接路径的标签。

4、有些标签有默认的边距,一般写样式表代码的时候都会先去除(也可以设置其他样式),去除边距如下:

<style type="text/css">

*    //格式对所有标签起作用

{
margin=0px auto;//auto表示居中,
padding=0px; } </style>
三种方法的优先级:
内联式 > 嵌入式 > 外部式
就近原则,嵌入式>外部式有一个前提:嵌入式css样式的位置一定在外部式的后面
以上规则适用于相同权值的情况
三、选择器

1.标签选择器。用标签名做选择器。

2.class选择器。都是以“.”开头。

3.ID选择器。以“#”开头。

<div id="样式名">

ID选择器只能在文档中使用一次,类选择器则可以使用多次
一个元素可以使用多个类选择器同时设置多个样式,而ID选择器是不可以的,如 <span class="stress bigsize">三年级</span>

4.复合选择器

(1)用“,”隔开,表示并列。

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

(3)筛选“.”。

CSS 分组选择符
多个标签使用逗号隔开:
h1,span{color:red;}
相当于:
h1{color:red;}
span{color:red;}

注:选择器作用到那个标签都那个标签起作用,有的要直接做用到某个标签上,才能起到作用

 

CSS样式表基础知识、样式表的分类及选择器的更多相关文章

  1. css+js+html基础知识总结

    css+js+html基础知识总结 一.CSS相关 1.css的盒子模型:IE盒子模型.标准W3C盒子模型: 2.CSS优先级机制: 选择器的优先权:!important>style(内联样式) ...

  2. QT 样式表基础知识

    1. 何为Qt样式表2. 样式表语法基础3. 方箱模型4. 前景与背景5. 创建可缩放样式6. 控制大小7. 处理伪状态8. 使用子部件定义微观样式 8.1. 相对定位    8.2. 绝对定位 摘要 ...

  3. SQL server基础知识(表操作、数据约束、多表链接查询)

    SQL server基础知识 一.基础知识 (1).存储结构:数据库->表->数据 (2).管理数据库 增加:create database 数据库名称 删除:drop database ...

  4. oracle 基础知识(十一)----表空间结构

    一,逻辑结构图 二.tablespace 01,Oracle表空间 它是一个逻辑的概念,它在物理上是不存在的. 02,oracle 存储结构 03.表空间特性 一个数据库可以包含多个表空间,一个表空间 ...

  5. oracle 基础知识(二)-表空间

    一,表空间 01,表空间? Oracle数据库是通过表空间来存储物理表的,一个数据库实例可以有N个表空间,一个表空间下可以有N张表.有了数据库,就可以创建表空间.表空间(tablespace)是数据库 ...

  6. 关于CSS你应该知道的基础知识 - 样式应用篇

    上一篇简单总结了一下选择器,如果一个元素被多个选择器选中,元素的样式就会以级联方式被应用到.要搞清最终那个样式被应用到元素上了,首先要明白引用CSS代码的几种方式. CSS代码引用方式 如何应用CSS ...

  7. Selenium基础知识(四)表单切换

    在测试过程中,经常会碰到frame和iframe,嵌套等情况 这种情况下直接通过id,name等等是无法定位到的 好在selenium替我们想到了这个问题switch_to方法解决问题 switch_ ...

  8. python 基础知识3-列表元祖

    1.列表增. # append 追加,给列表的最后面追加一个元素 li = ['alex','wufa','太白','大白'] li.append('教师') li.append(1) print(l ...

  9. CSS的一些基础知识

    <!DOCTYPE html><html><head><meta charset="utf-8"><title>标题&l ...

随机推荐

  1. 一維條碼 EAN13 的編碼方式

    何謂 EAN-13碼 ? ▲ 國家代號(3位數) 中華民國的國家代號為471. ▲ 廠商代號(6位數) 由本會核發給廠商6位數的廠商代號. ▲ 商品代號(3位數) 由廠商自行編定,按一物一號的原則,不 ...

  2. ThinkPHP 3 的输出

    一.ThinkPHP 3 的输出 (重点) a.通过 echo 等PHP原生的输出方式在页面中输出 b.通过display方法输出 想分配变量可以使用assign方法 c.修改左右定界符 休要修改配置 ...

  3. 我的 Azure VM 为何会重新启动?

    在客户创建的客服案件中, Azure VM意外重启是一个常见的问题,客户要求客服确定重新启动的原因.希望下面的详细说明能够帮助您了解 Azure VM重新启动的原因. WindowsAzure大约 ...

  4. javascript中对变量类型的推断

    本文正式地址:http://www.xiabingbao.com/javascript/2015/07/04/javascript-type 在JavaScript中,有5种基本数据类型和1种复杂数据 ...

  5. Ext2文件系统布局,文件数据块寻址,VFS虚拟文件系统

    注:本分类下文章大多整理自<深入分析linux内核源代码>一书,另有参考其他一些资料如<linux内核完全剖析>.<linux c 编程一站式学习>等,只是为了更好 ...

  6. NHibernate初入门之映射文件配置说明(三)

    转载逆心http://www.cnblogs.com/kissdodog/archive/2013/02/21/2919886.html 1. hibernate-mapping 这个元素包括以下可选 ...

  7. Windows Server 2012 R2 服务器管理器介绍和配置使用

    1. 服务管理器是用于管理系统服务的管理工具.一般常用于windows系统,使用这个工具你可以启动.停止服务:设置服务是自动.手动启动或禁用:查看某个服务的相关信息:设置服务以什么用户启动等等(一般包 ...

  8. zoj 2110

    这道题困扰我的不是算法问题.而是细节问题.不优化一直搜到底 时间是690ms左右 没有优化的dfs #include<stdio.h> #include<string.h> # ...

  9. C#中窗体的一些简单运用(Sixteenth Day)

    从今天开始,我们进入到学window form的知识,今天简单的学习了一些控件和事件的运用.没有什么很全面的理论,所以今天就总结下所写的程序.一个简单的注册页面程序 注册页面程序 要求: 1:修改所有 ...

  10. 【转载】设置event.cancelBubble,使触发子元素的onclick不同时触发父元素的onclick

    由于HTML中的对象都是层次结构,比如一个Table包含了多个TR,一个TR包含了多个TD Bubble就是一个事件可以从子节点向父节点传递,比如鼠标点击了一个TD,当前的event.srcEleme ...