码迷,mamicode.com
首页 > Web开发 > 详细

CSS基础知识

时间:2017-10-07 14:30:08      阅读:152      评论:0      收藏:0      [点我收藏+]

标签:strong   知识   组成   选择器   nbsp   可读性   cas   一个   式表   

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

       式表中,外部样式表通常存储在 CSS 文件中,多个样式定义可层叠为一。

2.   CSS 规则:由两个主要的部分构成:选择器,以及一条或多条声明。选择器就是需要改变样式的 HTML 元素。每条声明由一个属性和一个值组成,属性是设置的样式属性(style attribute),每个属性都有一 

    个值,属性和值用冒号分隔。CSS 声明总是以分号 ; 结束,声明组以大括号 {...} 括起来。为了让 CSS 可读性更强,可以每行只描述一个属性

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

      (1)行内样式:

          内联样式也叫行内样式或者行间样式,即在相关标签内使用样式(style)属性定义。如下:

 

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

 

 

 

      (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>

 

 

      (3)外部样式:

             外部样式也叫做外联样式,即使用 <link> 标签链接到外部样式表,如下:

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

 

4.    CSS 选择器

  • 元素选择器:标记名  {  声明块  }

 

        所有与该标记名匹配的元素,都将应用声明块中的规则。

  • 类选择器:.类名  {   声明块  }

       类必须以英文的点开始,所有class属性为指定类名的元素,都将应用声明块中的规则,可以将两个类名放在一起使用,类名中间空格隔开。

  • id选择器: # id值  {   声明块  }

       属性id为指定的元素,将应用声明块中的规则,在同一个html文档中,元素的id值必须唯一。

  • 后代选择器: 父级元素名称+空格+子级元素名称 {  声明块  }  
  • 子级选择器: 父级元素名称+>+子级元素名称 {  声明块  }
  • 并集选择器: 多个标签用逗号分开 
  • 属性选择器: 元素名称 [  属性名称+属性值 ] {  声明块 }

 

CSS基础知识

标签:strong   知识   组成   选择器   nbsp   可读性   cas   一个   式表   

原文地址:http://www.cnblogs.com/ljm-mwml/p/7634388.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!