(17)css 杂记之一

(1)当同一个HTML元素被应用不止一个样式定义时?

        一般而言,所有的样式会根据以下的规则层叠与一个新的虚拟样式表中:1. 浏览器缺省设置 2.外部样式表 3.内部样式表(<head>标签内) 4.内联样式(元素内部)。优先级为4>3>2>1。

(2)创建css的三种方式?

          1、外部样式表    <head>标签中添加<ling rel="stylesheet" type="text/css" href="***.css" />

          2、内部样式表   <head>标签中添加<style type="text/css">样式</style>

          3、内联样式       在相关元素中使用style属性

(3)CSS继承

        CSS的继承是指应用于某个元素的属性会被该元素的所有子元素继承。而THML中有如下<td class="code"></td>,CSS有如下规则:td {font-family: courier,courier-new,serif;} 或 td.code {font-family: courier-new,serif;} 。前一个表示对所有td应用样式font-family: courier,courier-new,serif ,而不是body设置的样式。后一条则表示对于包含code类的td,优先使用样式font-family: courier-new,serif,而不是对全部td设置的样式,更不是body设置的样式。所以,选择器更加特定于他所应用的元素。

(4)选择器

            1、类型(元素)选择器:h1,td,p{}

          2、id选择器:#id p {}    id选择器常用于建立派生选择器,表明指定id的div等中的某些元素应用何种样式

          3、 类选择器 (类的第一个字符不能为数字,firefox不支持)

                   .class p {}构建派生选择器,  td.classname {}  包含类classname的td应用对应规则。

多类选择器: .class1 .class2 {} 只有同时包含两个累的元素才能匹配该规则,例如:

   <p class="class2 class1"></> 或者<p class="class2 class3 class1"></>


          4、通配符选择器:* {}  为所有元素添加属性

            5 属性选择器:[title] {} 带有title属性的所有元素; [title=ss]{} title属性值为ss的所有元素

              (举个栗子:input [type="text"] {}    input[type="button"] {})而a[href] [title] {}则对同时有href和title属性的a元

素应用规则

          6、后代选择器(依据元素位置的上下文关系定义):li strong {} li元素中的strong 元素将应用该样式

  7、子元素选择器(与后代选择器先比,只能选择作为某元素直接子元素的元素):li > strong {}

          8、相邻兄弟选择器(对于有相同父元素的多个元素,匹配紧邻的后一个元素):li + strong {},将匹配与li紧邻

                的兄弟元素strong




  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值