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

CSS基础

时间:2017-08-01 19:11:07      阅读:175      评论:0      收藏:0      [点我收藏+]

标签:back   meta   pre   css基础   样式   文件   导入   16px   blog   

CSS规则由两个主要部分构成:选择器  属性操作

css 的四种引入方式:

  • 行内式:在标记的style属性中设定CSS样式
    <!--<div style="color: deeppink;background-color: aquamarine"> DIV</div>-->
  • 嵌入式:将CSS样式集中写在网页的<head></head>标签对的<style></style>标签对
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <style>
            p{
                background-color: #2b99ff;
            }
        </style>
    </head>
  • 链接式:将一个.css文件引入到HTML文件中
    <link href="mystyle.css" rel="stylesheet" type="text/css"/>
  • 导入式:将一个独立的.css文件引入HTML文件中,导入式使用CSS规则引入外部CSS文件,<style>标记也是写在<head>标记中
    <style type="text/css">
              @import"mystyle.css"; 此处要注意.css文件的路径
    </style> 

选择器

  • 标签选择器  标签名
  • Id 选择器         #id值
  • class 选择器   .class值
  • 通用选择器     *
  • 后代选择器: 父标签(空格)子标签  #父标签里所有符合子条件的子标签都选择出来
  • 子代选择器: 父标签 > 子标签 #父标签下子标签符合条件的选择出来,(子标签下符合条件的不算)
  • 多元素选择器:用逗号分隔上面的选择器
  • 毗邻选择器   左标签 + 右标签 (必须紧挨着)
  • 普通兄弟选择器  左标签 ~ 目标标签

CSS基础

标签:back   meta   pre   css基础   样式   文件   导入   16px   blog   

原文地址:http://www.cnblogs.com/mona524/p/7269687.html

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