CSS，层叠样式表，是对web页面显示效果进行控制的一套标准。当页面的内容受多种样式控制，将会按照一定的顺序处理。
CSS的作用：（1）将网页的内容结构和格式控制分开。（2）可以精确控制页面的所有元素。（3）使页面显示效果更加丰富
语法结构：CSS语法由选择符、属性和值三部分组成

<style type="text/css">
body { background-color: #cccccc }
↓ 　　　　 ↓ 　　　　　　　　 ↓
选择符　　 属性　　　　　　  值
<style>

CSS引用，三种方式

1.行内引用
直接写入html标签中：<body style="background-color:#ccccc;">
2.页内引用
将style标签定义在<head></head>之间：<head><style type="text/css ">body{ background-color:#cccccc;}</style></head>
3.外部引用
将CSS样式代码单独放在一个外部文件中，再由页面进行调用：
外部样式代码：body { background-color:#cccccc; }
在index中引用：
<head><link rel="stylesheet" type="text/css" href="style.css" /></head>

CSS优先级：1>2>3 (哪个样式近就用哪个)

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSS优先级</title>

<link rel="stylesheet" type="text/css" href="style.css" />

<style type="text/css ">body{ background-color:#cccccc;}</style>

</head>
<body style="background-color:red;">

</body>
</html>

由以上结果可知：行内引用>页内引用>外部引用

CSS注释符：/* 注释内容 */

CSS选择符
(1)通配选择符： * { color:blue;margin:0;padding:0;}
* 号表示所有的对象

(2)元素选择符： body {} h1 {}
指以网页中已有的标签名作为名称的选择符

(3)群组选择符： h1,h2, h3, p {font-size:12px;font-family:arial;}
除了可以对单个标签进行样式指定外，还可以对一组标签进行相同的样式定义

CSS入门的更多相关文章

  1. [HeadFist-HTMLCSS学习笔记][第七章CSS入门：加一点样式]

    CSS入门 style元素设置CSS 基本格式 <style type="text/css"> body { background-color: #eaf3da; } ...

  2. CSS入门教程——定位(positon)

    CSS入门教程——定位(positon) CSS定位在网页布局中是起着决定性作用.   定位 CSS的定位功能是很强大的,利用它你可以做出各种各样的网页布局.本节就介绍一些CSS常用的定位语句. 1. ...

  3. 第六十九节，css入门基础

    css入门基础 学习要点: 1.使用CSS 2.三种方式 3.层叠和继承 本章主要探讨HTML5中CSS (层叠样式表),它是用来对HTML文档外观的表现形式进行排版和格式化. 一 使用CSS CSS ...

  4. css入门二-常用样式

    css入门二-常用样式总结 基本标签样式 背景色background-color 高度height; 宽度width; 边框对齐以及详细设定举例 width/*宽度*/: 80%; height/*高 ...

  5. 胖虎都看得懂的CSS入门

    CSS入门 CSS是什么 摘自维基百科 层叠样式表(英语:Cascading Style Sheets,简写CSS),又称串样式列表.级联样式表.串接样式表.层叠样式表.階層式樣式表,一种用来为结构化 ...

  6. 【Python全栈-CSS】CSS入门

    CSS入门教程 参考: http://www.cnblogs.com/yuanchenqi/articles/5977825.html http://www.ruanyifeng.com/blog/2 ...

  7. day 31 html(二) 和css入门

    前情提要: 本次主要是继续昨天学的简单的html 补充以及 css的简单入门 一:表单标签 >1:get请求 <!DOCTYPE html> <html lang=" ...

  8. HTML与CSS入门经典(第9版)试读 附随书源码 pdf扫描版​

    HTML与CSS入门经典(第9版)是经典畅销图书<HTML与CSS入门经典>的最新版本,与过去的版本相同,本书采用直观.循序渐进的方法,为读者讲解使用HTML5与CSS3设计.创建并维护世 ...

  9. css入门知识点整理

    css入门知识点整理 不要嘲笑我这个蒟蒻..例子来源:w3school css其实就分为两个东西,一个是选择器,另外一个是声明.声明定义了某个对象的属性的值,这都是html的内容.重点要关注的是选择器 ...

  10. H5教程（二），CSS入门（一）选择器

    这是我的第二篇博客,H5教程CSS入门,适合刚开始学习H5的新手,让我们共同进步. 1.  CSS简介 1.1  CSS是什么? CSS称为样式层叠表,是用于增强或控制网页样式,并允许将样式信息与网页 ...

随机推荐

  1. PAT算法题学习笔记

    1001. 害死人不偿命的(3n+1)猜想 (15) 卡拉兹(Callatz)猜想: 对任何一个自然数n,如果它是偶数,那么把它砍掉一半:如果它是奇数,那么把(3n+1)砍掉一半.这样一直反复砍下去, ...

  2. GridView数据绑定

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Index.aspx.cs& ...

  3. jqury 右击事件插件

    在有些时候,网页中需要给一些标签对象加入右击的事件,在网上看了一些小的插件,但是不能根据this获取到当前的标签.所以相对他们进行改进一下.自己写了一个小的js右击事件.废话不多说了,看代码. $(f ...

  4. 第三天的学习知识HTML5常用的重要单词

    a:   a:猫     address:地址     alt:替用(一般是图片显示不出的提示) b:   b:粗体     br:换行     background:背景     border:边框 ...

  5. background-sizi （转）

    http://www.cnblogs.com/greenteaone/archive/2012/08/28/2659878.html  (原创作者链接地址  ) Background-Size:[ & ...

  6. SQLite一些函数用法

    --格林威治日期时间,比北京时间晚8小时 select datetime('now'); --格林威治日期 select date('now'); --本地时间 select time('now',' ...

  7. python基础编程

    1.if else var1 = 100 if var1: print ("1 - if 表达式条件为 true") print (var1) #为0时,条件不成立 var2 = ...

  8. apache服务器安装以及使用passenger插件部署rails应用

    小例子可以部署在rails自带的WEBrick上,逐渐往后走还得上Apache. 安装apache服务器 命令是sudo apt-get install apache2 安装passenger插件 安 ...

  9. Maven将依赖的所有jar包打成一个jar

    有些特殊情况下,需要将多个jar包打包成一个jar文件.如果使用maven可以加入如下插件: <build> <plugins> <plugin> <arti ...

  10. 第一次写Web API接口

    API是什么?只知道是网络接口,具体怎么写?不会!如何调用?不会!那怎么办? 第一次的经历~~ 需求:为其他项目提供一个接口 功能:为项目提供询盘信息和商家信息,格式为Json字符串 拿过来,就开始做 ...