css初步

2015/03/11 16:22
阅读数 6

CSS 层叠样式表:
 将网页中的样式分离出来,完全有CSS来控制.增强杨思的复用性及可扩展性.

 格式:
  选择器{属性名:属性值;...}
 
 一、css和html代码结合的四种方式:
 1,每一个html标签都有个style属性.
 2,当页面有多个标签有相同样式时,可以进行复用,在html的head部分定义style标签,并嵌入css带按摩.
  <style>
   css代码.
  </style>
 3,当有多个页面中的标签有相同样式时,可以讲样式单独封装成一个css文件,通过在每个页面中定义:
  <style>
   @import url("1.css");
  </style>
  将css文件加载到页面.
 4,通过html中的head标签中的link标签连接一个css文件.
  <link rel=""stylesheet href="1.css" />
  使用技巧:可以讲多个css样式(文件)加载到一个css文件(如:manage.css)中,只要在html页面中加载这个manage.css即可.可以直接对这个css文件进行管理,而不需要调整html代码.
  例如: 有两个样式表:a.css, b.css.
   在html中加载1.css即可,而1.css只需要导入这两个文件.
   @import url("a.css")
   @import url("b.css")
  
 二、选择器:css样式作用的标签容器.
  当样式分离后,html作用在于用标签封装数据,然后将css加载进来租用于指定标签上.

  (一)选择器的分类:
  1,标签选择器:就是html中的每一个标签名.
  2,类选择器:就是每一个标签中的class属性,用.的形式来标示.
   只对css所使用,可以给不同的标签尽心相同的样式设定.
  3,ID选择器:其实就是每一个标签中的ID属性,但是要保证ID的唯一性,用#来标示.
   ID属性不仅可以被css使用,还可以被javascript使用.
  
  选择器的优先级:ID>class>标签.

  (二)扩展选择器:
   1、关联选择器:就是对标签中的标签进行样式定义.
    格式:选择器 选择器 ...
   2、组合选择器:对多个选择器进行相同的样式定义,将多个选择器通过,隔开.
   3、为元素选择器:其实就是元素的一种状态.
    a:link——超链接被点前的状态.
    a:visited——超链接点击后的状态.
    a:hover——鼠标悬停在超链接上的状态
    a:active——点击超链接时.
    p:first-letter——首字母
    P:first-line——首行
    :focus——获得焦点时.

   css滤镜:通过一些代码丰富了样式.

   css帮助文档.

展开阅读全文
打赏
0
0 收藏
分享
加载中
更多评论
打赏
0 评论
0 收藏
0
分享
返回顶部
顶部