今天开始学习css;应用一本《HTML5与CSS3网页设计基础》

先学习css样式规则声明。

Body{ color:blue}

对应:选择符:{声明属性:声明值};

Background-color:属性

Body{ Background-color:yellow}

配置元素背景颜色css属性是Background-color:,颜色是黄色

Color属性

Body{ color:red}

配置文本颜色css属性是color,颜色是红色。

配置背景颜色也文本颜色

Body{ Background-color:yellow  color:red }

注意:css语法允许通过多种方式配置颜色:

l  十六进制颜色值

l  十六进制短颜色值

l  十进制颜色值(RGB三元组)

l  Css3新增的HSL

配置css方式有四种:内联,嵌入,外部和导入。

Style属性

<h1 style=“color:#cc0000”>

如果属性不止一个,用;分割开。

<h1 style=“color:#cc0000 Background-color:yellow”>

将全局body标记配置成白底绿字。这种样式也会被其他元素继承

<Body style=“Background-color:yellow  color:#cc0000”>

h1元素配置成绿底白字。将覆盖body元素的全局样式。

<h1 style=”background-color:#008080; color:#F5F5F5;”>

内联样式并不常用。它的效率并不高,并且会给网页带来额外的代码。不便于维护。

配置嵌入的css

嵌入样式将于与整个文档,这些样式将要放在head部分的<style>中,以<style>开始,以</style>结束。

代码为

<head>

<style>

Body{

Background-color:#CCFFFF;

Color:#000033;

</style>

</head>

}

嵌入的css样式可以用于h1,h2,div,p,ul,ol,li,等元素

在head中配置body,h1,h2

<style>

Body{background-color:#E6E6F6;color:#191970;}

h1{background-color:#E6E6F6;color:#191970;}

h2{background-color:#E6E6F6;color:#191970;}

配置外部css

当css位于网页文档内部时,css的灵活性与强大才真正显露无遗。

外部样式是包含css样式规则的文本文件,使用. Css拓展名。通过link相关联。因此,多个网页可以共同关联同一个. Css文件。

Link元素

Rel属性值是“stylesheet”

Href属性值是“.css”文件名

Type属性值是“text/css”

例如在head中加入一下代码,将网页和外部样式表与color.css关联。

<link rel=”stylesheet” href=””color.css”>

开始学习css的更多相关文章

  1. 学习 CSS 样式

    1.CSS浮动  :  http://www.cnblogs.com/zhongxinWang/archive/2013/03/27/2984764.html (1)一个重要结论:           ...

  2. css知多少(2)——学习css的思路

    两周之前写过该系列的第一篇,其实当时只是一个想法,这段时间迟迟未更新,是在思考一个解决过程.现在初有成效,就开更吧. 1. 一个段子 开题不必太严肃,写博客也不像写书,像聊天似的写东西是最好的表达方式 ...

  3. HTML+CSS学习笔记 (6) - 开始学习CSS

    HTML+CSS学习笔记 (6) - 开始学习CSS 认识CSS样式 CSS全称为"层叠样式表 (Cascading Style Sheets)",它主要是用于定义HTML内容在浏 ...

  4. 如何深入学习CSS

    学习CSS有了一定基础后,有的人会觉得好象没有什么学的.因为知道一些基本的理论性的东西.CSS说它容易是因为它的知识点有限.说它难学就在于各浏览器对CSS的支持程度不同.如何深入学习我给出以下几点见意 ...

  5. 【图片版】学习CSS网格布局

    简言 CSS网格布局(Grid)是一套二维的页面布局系统,它的出现将完全颠覆页面布局的传统方式.传统的CSS页面布局 一直不够理想.包括table布局.浮动.定位及内联块等方式,从本质上都是Hack的 ...

  6. 学习CSS的思路(转)

    两周之前写过该系列的第一篇,其实当时只是一个想法,这段时间迟迟未更新,是在思考一个解决过程.现在初有成效,就开更吧. 1. 一个段子 开题不必太严肃,写博客也不像写书,像聊天似的写东西是最好的表达方式 ...

  7. 《学习CSS布局》学习笔记

    近几天做了一个小的企业展示网站.虽然页面是在模板的基础上改的,但改的多了不熟悉CSS也很麻烦.正好我看到了学习CSS布局这个网站,于是补习了一下CSS知识. CSS的显示 CSS的元素分为两类:块级元 ...

  8. 学习css盒子模型

    在这一周,我学习了css,在没有学习css之前,我一直都觉得布局很难,样式特别难调,但是学习了css盒子模型之后我就觉得欸,其实还挺简单的,下面就来看看我学习的css吧. CSS 盒子模型(Box M ...

  9. 学习css常用基本层级伪类属性选择器

    常见的css选择器包含:常用选择器.基本选择器.层级选择器.伪类选择器.属性选择器,其中常用选择器分为:1.html选择符*{}//给页面上所有的标签设置模式:2.类选择符.hcls{}//给clas ...

随机推荐

  1. nyoj 20 吝啬的国度

    吝啬的国度 时间限制:1000 ms  |  内存限制:65535 KB 难度:3   描述 在一个吝啬的国度里有N个城市,这N个城市间只有N-1条路把这个N个城市连接起来.现在,Tom在第S号城市, ...

  2. Flask框架获取用户IP地址的方法

    本文实例讲述了python使用Flask框架获取用户IP地址的方法.分享给大家供大家参考.具体如下: 下面的代码包含了html页面和python代码,非常详细,如果你正使用Flask,也可以学习一下最 ...

  3. HDU 3790 最短路径问题 (最短路)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=3790 简单的最短路问题,这题听说有重边.我用spfa和dijkstra写了一遍,没判重边,速度都差不多 ...

  4. XML操作:2.LINQ TO XML(http://www.cnblogs.com/AlexLiu/archive/2008/10/27/linq.html)

    LINQ to XML 建立,读取,增,删,改   LINQ to XML的出现使得我们再也不需要使用XMLDocument这样复杂的一个个的没有层次感的添加和删除.LINQ可以使的生成的XML文档在 ...

  5. js中的if判断十分优美的简洁写法

    本尊混迹猿人类也有5年有余,从最开始的C#到java再到php到至今的python,不能说精通,也算得上是熟悉,对各个语言的语法也算是了解. 虽然目前在开发web程序,了解一些java知识,但是今天在 ...

  6. SmallDateTime时间范围检查

    SamllDataTime是SQL Server中的一种表达时间的类型, 精度不高但是省空间,具体的细节就查看一下MSDN的文档吧. http://msdn.microsoft.com/zh-cn/l ...

  7. ADO.NET 快速入门(七):使用数据库事务

    数据库事务用于控制数据提交到数据库.例如,在标准的账户程序,账户的借贷必须同时完成.由于电脑偶尔发生故障(电力中断.网络中断,等等),可能有些记录被更新或者添加,但是另外一些没有.为了避免这些情况,可 ...

  8. PostgreSQL的 initdb 源代码分析之二十二

    继续分析 load_plpgsql(); 展开: 就是让postgres 执行 create extension plpgsql cmd是: "/home/pgsql/project/bin ...

  9. Hyper-V故障转移群集

    Hyper-V故障转移群集配置完成后,在故障转移群集管理器中新建虚机:角色-虚拟机-新建虚拟机 如果直接在Hyper-V管理器中新建虚机,则不是高可用,需要在故障转移群集管理器中将其添加进来使其成为高 ...

  10. Spring生态

    1.简洁有力,干掉了j2ee容器层特别是ejb,spring在rod Johnson十几年前一个人单挑j2ee体系开始,到十年前开始大行其道至今,基本上是java开发领域的事实标准.从此大部分开发者去 ...