一.概述

层叠样式表;可以对HTML的元素,进行控制,使HTML的元素展现的效果和位置更好;

二.基本语法

css规则由两个部分构成:选择器和语句

语句规则:

1.css选择器的名称区分大小写;属性名和属性值区分大小写;

2.每条语句的结尾都要使用;,最后一行可以省略;

3.注释格式:/**/

4.css在html中写的代码需要使用style标签包裹起来;

5.如果单独写一个css文件,则不需要使用style标签,所有的语句需要使用大括号包裹起来;

6.如果属性值中包含空格,必须使用双引号包裹起来;

7.如果一个属性名对应多个属性值,多个属性值用空格隔开;

8.css文件的后缀名.css;

三.格式:

选择器{
     属性名: 属性值;
     属性名: 属性值;
     属性名: 属性值;
     ...........

}

四.选择器

1.ID选择器

#id的属性值{
     属性名: 属性值;
     属性名: 属性值;
     .....

}

2.类选择器

.class属性的属性值{
     属性名: 属性值;
     属性名: 属性值;
     .....

}

3.元素选择器(标签选择器)

标签名{
     属性名: 属性值;
     属性名: 属性值;
     .....

}

4.属性选择器

标签名[属性名=属性值]{
     属性名: 属性值;
     ....

}

5.包含选择器

基本选择器 标签名{
     属性名: 属性值;
     ....

}

四.与html整合的方式

1.在html的head标签中使用link标签

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

2.在html的页面的head标签中使用style标签,在style标签内也可以写css代码;只能该html文件使用,其他html不能用;

3.在开头标签中,写属性名style=”属性名=属性值;属性名=属性值;”;

CSS快速入门的更多相关文章

  1. CSS快速入门(四)

    目录 CSS快速入门(四) 浮动 float属性 clear属性 浮动解决的问题及其影响 解决父标签塌陷的方法 浮动案例 定位 什么是脱离文档流 定位的两种方法 position定位 static定位 ...

  2. Html与CSS快速入门01-基础概念

    Web前端技术一直是自己的薄弱环节,经常为了调节一个简单的样式花费大量的时间.最近趁着在做前端部分的开发,果断把这部分知识成体系的恶补一下.内容相对都比较简单,很类似工具手册的学习,但目标是熟练掌握. ...

  3. Html与CSS快速入门02-HTML基础应用

    这部分是html细节知识的学习. 快速入门系列--HTML-01简介 快速入门系列--HTML-02基础元素 快速入门系列--HTML-03高级元素和布局 快速入门系列--HTML-04进阶概念 示例 ...

  4. Html与CSS快速入门03-CSS基础应用

    这部分是html细节知识的学习. 快速入门系列--HTML-01简介 快速入门系列--HTML-02基础元素 快速入门系列--HTML-03高级元素和布局 快速入门系列--HTML-04进阶概念 边框 ...

  5. Html与CSS快速入门04-进阶应用

    这部分是html细节知识的学习. 快速入门系列--HTML-01简介 快速入门系列--HTML-02基础元素 快速入门系列--HTML-03高级元素和布局 快速入门系列--HTML-04进阶概念 之前 ...

  6. HTML/CSS快速入门

    Web概念 JavaWeb 使用java语言开发基于互联网的项目 软件架构 C/S架构:Client/Server 客户端/服务器 用户本地有一个客户端程序,在远程有一个服务端程序 如QQ,英雄联盟. ...

  7. #001 CSS快速入门讲解

    CSS入门讲解 HTML人+CSS衣服+JS动作=>DHTML CSS: 层叠样式表 CSS2.0 和 CSS3.0 版本,目前学习CSS2, CSS3只是多了一些样式出来而已 CSS 干啥用的 ...

  8. CSS快速入门例子

    CSS入门应用 01-结合方式01 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " ...

  9. CSS快速入门基础篇,让你快速上手(附带代码案例)

    1.什么是CSS 学习思路 CSS是什么 怎么去用CSS(快速上手) CSS选择器(难点也是重点) 网页美化(文字,阴影,超链接,列表,渐变等) 盒子模型 浮动 定位 网页动画(特效效果) 项目格式: ...

  10. 02-03 CSS快速入门

    css四种引入方式:test.html: p{ color: gold; font-size: 20px; } title.html: <!DOCTYPE html> <html l ...

随机推荐

  1. [POI2007]ZAP-Queries 数学

    题目描述 Byteasar the Cryptographer works on breaking the code of BSA (Byteotian Security Agency). He ha ...

  2. CentOS7更换yum源为阿里云镜像源

    1. 备份原来的yum源 cp /etc/yum.repos.d/CentOS-Base.repo /etc/yum.repos.d/CentOS-Base.repo.bak 2.设置aliyun的y ...

  3. springcloud微服务总结二 注册中心

    一:netflix和springcloud关系 netflix公司开源了很多组件,包括服务注册与发现(Netflix Eureka).断路器(Netflix Hystrix).负载均衡(Netflix ...

  4. DDOS压力测试

    分布式拒绝服务(DDoS:Distributed Denial of Service)攻击指借助于客户/服务器技术,将多个计算机联合起来作为攻击平台,对一个或多个目标发动DDoS攻击,从而成倍地提高拒 ...

  5. 【算法笔记】B1047 编程团体赛

    1047 编程团体赛 (20 分) 编程团体赛的规则为:每个参赛队由若干队员组成:所有队员独立比赛:参赛队的成绩为所有队员的成绩和:成绩最高的队获胜. 现给定所有队员的比赛成绩,请你编写程序找出冠军队 ...

  6. web 导出数据到 exls 中

    // 文件下载:导出excel表 @RequestMapping(value = "/exportExcel", method = {RequestMethod.GET}) @Re ...

  7. [转] 你并不需要Underscore/Lodash

    [From] https://segmentfault.com/a/1190000004460234 Lodash 和 Underscore 是非常优秀的当代JavaScript的工具集合框架,它们被 ...

  8. log4j详解与实战

    [转自] http://www.iteye.com/topic/378077 log4j是一个非常强大的log记录软件,下面我们就来看看在项目中如何使log4j. 首先当然是得到log4j的jar档, ...

  9. 认识HTML中表格、列表标签以及表单控件

    前端之HTML,CSS(二) HTML标签 列表标签 无序列表:闭标签,由<ul><li></li>...</ul>组合而成,效果成纵向列表.格式:&l ...

  10. PIE SDK栅格增强控制

    1. 功能简介 亮度是指发光体(反光体)表面发光(反光)强弱的物理量:对比度指的是一幅图像中明暗区域最亮的白和最暗的黑之间不同亮度层级的测量:透明度是描述光线透过的程度 栅格数据增强控制主要是通过对亮 ...