CSS（Cascading Style Sheets）层叠样式表

含义

一种计算机语言；

能够实现网页与内容分离；

用来表现文件样式，如HTML或XML；

比較

div与css

假设说div是容器的话，那么css就是装饰或是表现容器样式的事物。比方div是盒子，那么css的作用就是表示盒子的颜色，大小，体积等。

html与css

html是负责网页内容的；css是负责网页样式的，并且css非常好的解耦网页的内容和样式。

选择器

设置选择器之后，我们就能够设置CSS样式了。

那不设选择器行不行呢？能够在word中类比一下，我们就能够把文章中每段或每行的文字都设成一个独有的样式，这个样式能够包含font-size(字体大小)，width，height等等。

CSS中的选择器能够分为id选择器，class选择器和Html选择器。

1）、id选择器

能够为标有特定id的HTML元素制定特定的样式，以“#”来定义。

#newnews {

    /*最新新闻框架*/

    font-size :20px;

    margin-left :5px;

    margin-bottom :10px;

}

2）、class选择器

用来描写叙述一组元素的样式，可在多元素中使用，以一个点"."号显示。

.replay {

    margin-bottom :30px;/*底部的外边距*/

}

3）、html标签选择器

没有标识，直接引用

用法

看了前面的这两个样例，有人肯定会有这种疑惑：我们为newnews，replay设置了样式，那在网页上他们是怎么使用的呢？

接下来，我们就讲一下定义网页的方法。

1）、外部：将网页链接到外部样式表。

2）、内页：在网页上创建嵌入的样式表。

3）、行内：一个用内嵌样式到各个网页元素。

第一种：-->写在css文件里

在其它网页上使用同样的样式时，或为了保持网页的外观一致总体性，能够採用外部样式。外部样式更改也十分方便。

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

    <!--外部样式表即login.css-->

另外一种：-->写在head头部

当我们仅仅要定义当前网页的样式事，可採用嵌入的样式表。它“嵌”在网页的 <HEAD>
标记符内。

<head>

<title>页面标题</title>

<styletype="text/css">

<!--

p{

color:#FF00FF;

text-decoration:underline;

font-weight:bold;

font-size:25px;

}

-->

</style>

   </head>

第三种：-->在html中

当特殊的样式须要应用到个别元素时。使用内联样式的方法是在相关的标签中使用样式属性。

<p style="color: black; margin-left: 20px">

这里是文字！

</p>

CSS看似是一个新东西，但仅仅要动手去实践，就会发现，它的非常多知识都是之前接触到的。比方设置字体、行间距等等，要多多尝试。

      介绍了CSS的概念和几种用法后，下篇博客主要讲的是CSS的核心内容。

CSS——（1）基础的更多相关文章

  1. 2天驾驭DIV+CSS （基础篇）（转）

    这是去年看到的一片文章,感觉在我的学习中,有不少的影响.于是把它分享给想很快了解css的兄弟们. 基础篇[知识一] “DIV+CSS” 的叫法是不准确的[知识二] “DIV+CSS” 将你引入两大误区 ...

  2. HTML+CSS+JS基础知识

    HTML+CSS+JS基础知识 目录 对HTML+CSS+JS的理解 基础知识 对HTML+CSS+JS的理解 基础知识 插入样式表的三种方式 外部样式表:<link rel="sty ...

  3. 【笔记-前端】div+css排版基础，以及错误记录

    现在的网站对于前端的排版已经逐渐不使用<table>,而是使用div+css. 使用这种方法的最大好处就在于在维护页面时,可以只维护css而不去改动html. 可是这种方式对于初学者来说可 ...

  4. CSS 设计彻底研究（一）(X)HTML与CSS核心基础

    第1章 (X)HTML与CSS核心基础 这一章重点介绍了4个方面的问题.先介绍了 HTML和XHTML的发展历程以及需要注意的问题,然后介绍了如何将CSS引入HTML,接着讲解了CSS的各种选择器,及 ...

  5. 精通CSS+DIV基础总结(一)

    这段时间学习了玩了DIV+CSS的视频,感觉效率不高.前边的Javascript总结的不好,但是看了后边的JQuery,觉得学习的再多一点,再进行Javascript的总结.DIV+CSS总结,估计会 ...

  6. CSS样式基础知识

    CSS样式基础知识 CSS样式概述 CSS是Cascading Style Sheet 的缩写.译作“层叠样式表单”.是用于(增强)控制网页样式并允许将样式信息与网页内容分离的一种标记性语言. 引用位 ...

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

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

  8. 【CSS入门基础，有需要的看过来哦】心境，心静，不轻言放弃！---致CSS

    整理一下近一周学习的有关CSS的基础知识笔记: CSS语法必须写在<style>标签中哦~/*注释*/ [CSS常用背景属性]background background-color:背景色 ...

  9. 学起来 —— CSS 入门基础

    Hello,大家好! 小女来更博啦!CSS福利送上~~~ 首先给大家介绍一下CSS到底是什么? 一.CSS概念 W3C规范中,要求有三条:一 为"两个分离",二 为语言遵循语义化, ...

  10. 第二部分----CSS的基础语法

    PART-1 CSS的基础常识 一.什么是CSS? W3C标准中,倡导有3:其一为内容与表现分离,其二为内容与行为分离,其三为内容结构的语义化.其倡导中第一条的"表现"指的便可以说 ...

随机推荐

  1. 【原】K3Cloud平台开发之Python插件

    有时候我们的表单可能很简单,只是一个简单交互的表单,但有可能还是要劳师动众的给它建个工程写个插件,是不是很不爽?例如我有如下一个表单: 功能很简单就是选个业务对象,收集绑定几个字段名,然后确定返回一个 ...

  2. 《Zero to One》的一些读书笔记

    第一章<The Challenge of the Future>:全球化是横向的扩张,只能复制以前就有的成功,而科技创新是纵向的扩张,是创造以前不存在的东西.没有科技创新,只有全球化,这个 ...

  3. java 伪共享

    MESI协议及RFO请求典型的CPU微架构有3级缓存, 每个核都有自己私有的L1, L2缓存. 那么多线程编程时, 另外一个核的线程想要访问当前核内L1, L2 缓存行的数据, 该怎么办呢?有人说可以 ...

  4. Milk Patterns

    poj3261:http://poj.org/problem?id=3261 题意:给定一个字符串,求至少出现k 次的最长重复子串,这k 个子串可以重叠. 题解:还是用后缀数组,求H和后缀数组,然后二 ...

  5. -AC自动机-题表

    2016-07-13 09:59:42

  6. 【UVALive - 5131】Chips Challenge（上下界循环费用流）

    Description A prominent microprocessor company has enlisted your help to lay out some interchangeabl ...

  7. MySQL安装完可以使用，但是找不到对应的系统服务

    为何我用 mysqld 启动 mysql 的服务后,在系统“服务”中查不到mysql服务呢?首先声明,我的服务启动成功了,因为我可以另开一个 cmd 窗口进行mysql登录,登录后可以进行各种操作.用 ...

  8. R语言 一元线性回归

    #一元线性回归的基本步骤#1.载入数据 给出散点图 x<-c(0.10,0.11,0.12,0.13,0.14,0.15,0.16,0.17,0.18,0.20,0.21,0.23) y< ...

  9. bzoj2653

    CLJ神牛的可持久化论文的题目,果然厉害其实第一步能想到后面就还是很简单的首先是二分答案,转化为判定性问题然后对于区间内的数,比他大的标为1,小的标为-1显然,如果存在一个左右端点符合的区间使得这个区 ...

  10. 【转】ButterKnife基本使用--不错

    原文网址:http://www.cnblogs.com/mengdd/archive/2015/06/23/4595973.html Butter Knife处理字段和方法绑定. 配置: 用gradl ...