css层叠样式表

css层叠样式表

样式声明方式:优先级由高到低

  • 元素内联样式:
    通过元素内style属性,用冒好分割键和值,用分号分割不同样式
    <p style=”color: green;margin_left: 30px”></p>
  • 中的内联样式:
    在整个页面中有效,<style>标签中内容由选择器及其样式组成
    <style type=”text/css”>
    p{color: green;margin_left: 30px}
    </style>
  • 外联样式:
    将css数据单独保存为一个文件,在<link>标签中引用,内容由选择器及其样式组成
    <head>
    <link rel=”stylesheet” type=”text/css” href=”文件名.css”>
    </head>
  • 浏览器默认样式:不同浏览器不同

css语法

  • 由选择器和样式属性组成:
    selector{key1:value1 ;key2:value2…}
  • 四种基本选择器:
    通配选择器:*{}
    标签选择器:标签{}
    Class选择器:.class属性值{}     标签.calss属性
    id选择器:#id属性值{}     标签#id属性
  • 基本组合:
    S1,S2{}:多选择器,满足S1或S2的标签
    S1>S2:子元素选择器,S1的直接子标签为S2
    S1 S2:后代选择器,S1中的S2标签
    S1+S2:相邻选择器,后面紧随S2的S1标签
  • 其他选择器:
    [属性]{}:属性选择器,有该属性的标签
    [属性=”值”]:属性和值选择器,属性等于该值的标签
    链接已点击选择器:选择未访问、已访问、悬浮和活动链接,并设置它们的样式:
    a:link    {color:blue;}
    a:visited {color:blue;}
    a:hover   {color:red;}
    a:active  {color:yellow;}

基于css和div的页面布局

  • css布局常用属性:
    position:元素位置类型absolute(绝对位置),relative(相对父元素的位置),static(固有位置)
    direction:元素内容靠哪侧ltr(靠左),rtl(靠右)
    float:元素本身靠屏幕哪侧left(左),right(右)
    hight(高度),width(宽度),margin(边框外部留白),border(边框),padding(边框内部填充):pt,px,%,em

转载于:https://www.cnblogs.com/Wang-Y/p/9277773.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值