1、CSS 简介

　　CSS 指层叠样式表 (Cascading Style Sheets)，是一种用来表现 HTML 文档样式的语言，样式定义如何显示 HTML 元素，是能够真正做到网页表现与结构分离的一种样式设计语言。样式通常存储在样式表中，外部样式表通常存储在 CSS 文件中，多个样式定义可层叠为一。

　　HTML 标签被设计为用于定义文档内容，也就是文档结构，为了增强代码的可读性，实现网页结构与表现相分离的原则，万维网联盟（W3C），肩负起了 HTML 标准化的使命，并在 HTML4 之外创造出样式（Style）。CSS 目前最新版本是 CSS3，相对于传统 HTML 的表现而言，CSS 能够对网页中对象的位置排版进行像素级的精确控制，拥有对网页对象编辑的能力，易于维护和改版，提高页面浏览速度，使用 CSS 布局页面更符合 W3C 标准，他是目前基于文本展示最优秀的表现设计语言。

　　CSS 样式表极大地提高了工作效率：样式通常保存在外部的 .css 文件中，通过仅仅编辑一个简单的 CSS 文档，外部样式表有能力同时改变站点中所有页面的布局和外观。

2、CSS 语法

　　CSS 规则由两个主要的部分构成：选择器，以及一条或多条声明。如下：

 p{

      color:red;

      text-indent:2em; /* 段落缩进2个字，即段落开头空2个汉字的位置。 */

  }

3、创建 CSS

　　当读到一个样式表时，浏览器会根据它来格式化 HTML 文档。CSS 创建样式表有三种方法：内联样式、内部样式、外部样式。

　　(1)、内联样式

　　内联样式也叫行内样式或者行间样式，即在相关标签内使用样式（style）属性定义。如下：

 <div style="width:200px;height:100px;border:1px solid black;"></div>

由于要将表现和内容混杂在一起，内联样式会损失掉样式表的许多优势。因此需要慎用这种方法，例如当样式仅需要在一个元素上应用一次时，可以使用内联样式。要使用内联样式，需要在相关的标签内使用样式属性定义，style 属性可以包含任何 CSS 属性。

　　(2)、内部样式

　　内部样式也叫内嵌样式，即在文档中创建内嵌的样式表，需要使用 <style> 标签在文档头部定义内部样式表，如下：

 <head>

 <style>

 div{

     width:200px;

     height:100px;

     border:1px solid black;

 }

 p{

     color:blue;

     font-size:14px;

 }

 span{

     color:black;

     font-weight:bold;

 }

 </style>

 </head>

CSS基本知识汇总的更多相关文章

  1. CSS入门知识汇总

    1.CSS认识 在谈论CSS的概念之前,我们先说一说web标准的目的——其在于创建一个统一的用于web表现层的技术标准,以便通过不同浏览器或终端设备向最终用户展示信息内容.一个网页的呈现是由三部分组成 ...

  2. CSS基础知识汇总

    前言 原文连接:http://www.cnblogs.com/wanghzh/p/5805678.html 在此基础上又做了大量的扩充 CSS简介 CSS是Cascading Style Sheets ...

  3. 看这一篇就够了,css选择器知识汇总

    对大多技术人员来说都比较熟悉CSS选择器,举一例子来说,假设给一个p标签增加一个类(class),可是执行后该class中的有些属性并没有起作用.通过Firebug查看,发现没有起作用的属性被覆盖了, ...

  4. 最全的jQuery知识汇总

    本帖最后由 断天涯大虾 于 2016-12-26 10:22 编辑<ignore_js_op> jQuery是什么? jQuery是javascript编写一个可重用的JavaScript ...

  5. jquery基础知识汇总

    jquery基础知识汇总 一.简介 定义 jQuery创始人是美国John Resig,是优秀的Javascript框架: jQuery是一个轻量级.快速简洁的javaScript库.源码戳这 jQu ...

  6. JavaScript正則表達式知识汇总

    Js 正則表達式知识汇总 正則表達式: 1.什么是RegExp?RegExp是正則表達式的缩写.RegExp 对象用于规定在文本中检索的内容. 2.定义RegExp:var +变量名=new RegE ...

  7. web前端project师知识汇总

    分类: Web开发应用  一.何为Web前端project师?           前端project师,也叫Web前端开发project师.他是随着web发展.细分出来的行业.Web前端开发proj ...

  8. Oracle手边常用70则脚本知识汇总

    Oracle手边常用70则脚本知识汇总 作者:白宁超 时间:2016年3月4日13:58:36 摘要: 日常使用oracle数据库过程中,常用脚本命令莫不是用户和密码.表空间.多表联合.执行语句等常规 ...

  9. Oracle 数据库知识汇总篇

    Oracle 数据库知识汇总篇(更新中..) 1.安装部署篇 2.管理维护篇 3.数据迁移篇 4.故障处理篇 5.性能调优篇 6.SQL PL/SQL篇 7.考试认证篇 8.原理体系篇 9.架构设计篇 ...

随机推荐

  1. windows 下配置 Nginx 常见问题(转)

    windows 下配置 Nginx 常见问题 因为最近的项目需要用到负载均衡,不用考虑,当然用大名鼎鼎的Nginx啦.至于Nginx的介绍,这里就不多说了,直接进入主题如何在Windows下配置. 我 ...

  2. oracle sql

    show user desc 'table' SELECT DISTINCT SELECT * FROM emp WHERE comm is NOT NULL; SELECT * FROM emp W ...

  3. visual studio 远程服务器返回了意外响应:(417)expectation failed

    解决方法: 修改devenv.exe.config文件,添加 <servicePointManager expect100Continue="false" /> C:\ ...

  4. C#/ASP.NET MVC微信公众号接口开发之从零开发（二） 接收微信消息并且解析XML(附源码)

    文章导读: C#微信公众号接口开发之从零开发(一) 接入微信公众平台 微信接入之后,微信通过我们接入的地址进行通信,其中的原理是微信用户发送消息给微信公众账号,微信服务器将消息以xml的形式发送到我们 ...

  5. C#/ASP.NET MVC微信公众号接口开发之从零开发（三）回复消息 （附源码）

    C#/ASP.NET MVC微信接口开发文章目录: 1.C#/ASP.NET MVC微信公众号接口开发之从零开发(一) 接入微信公众平台 2.C#/ASP.NET MVC微信公众号接口开发之从零开发( ...

  6. iOS开发网络篇—NSURLConnection基本使用

    iOS开发网络篇—NSURLConnection基本使用 一.NSURLConnection的常用类 (1)NSURL:请求地址 (2)NSURLRequest:封装一个请求,保存发给服务器的全部数据 ...

  7. iOS 通讯录操作

    转载至:http://superuna.blog.51cto.com/4192682/982938 //新增联系人 -(void)AddPeople {         //取得本地通信录名柄     ...

  8. <1 小玩意(覆盖效果)

    <!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8& ...

  9. 初学JavaScript七大注意事项

    知识说明: 初学JavaScript,注意以下七大细节,在实现同样功能的情况下,让我们的代码更易懂.效率更高. 一.简化代码 例如:创建对象 之前是这样的: Var car = new object( ...

  10. Android平板电脑开发— — —碎片

    碎片是一种可以嵌入在活动中的UI片段,它能让程序更加合理与充分地使用大屏幕的空间,碎片通常都是在平板电脑开发中才会使用 简单实例 左碎片布局 <?xml version="1.0&qu ...