css样式的三种方法及选择器

css样式三种方法
  1. 第一种:内联样式
<p style=" 属性:值;属性:值;... "></p>
  1. 第二种:外联样式
<link rel="stylesheet" href="url">
  1. 第三种:内部样式,选择器
<html>
<head>
 <meta charset="UTF-8">
 <title>css样式三种方法</title>
 <link rel="stylesheet" href="K:/eidtplus/外联选择器.css">
 <style type="text/css">
  #pc,#p1,#hh5{  
   color:blue;
   border:1px solid red;   
  }
  .pp{
  color:black;
  }  
  p{
  color:red;
  }
  [align="center"]{
    color:pink;
  }
 </style>
</head>
<body>
<p id="pp" class="c">
  id选择器:#pp{属性:值} [align="center"]{} .c{}  p{}  
 </p>
 </body>
 </html>
  • (在同一个文件下,没有外联样式)这三个选择器的优先级是:
    标签选择器《class选择器《属性选择器《id选择器《内联样式
  • (不在同一个文件下,有外联样式)
    当标签内部 有style内联样式时,外联样式小于内联样式,无论外联样式的选择器为何等级。
    当标签内没有style内联样式时,首先进行外联样式的选择器和内部选择器样式进行选择器比较,当等级一样时内部选择器样式等级高。
四种选择器:(优先级从高到低)
  • id选择器
  • 属性选择器
  • class选择器(类选择器)
  • 标签选择器
今天心情很不好,暂且就回顾到这里吧。我相信,付出总会有回报的。
夜深人静。
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 如果你真的天下无敌,那么为什么至今仍旧碌碌无为?为什么梦想始终没有实现?为什么不满意当下的生活?承认自己的不足吧,...
    茜_b91e阅读 903评论 0 0
  • 今天星期天,本该休息的日子,但我早早的就起床,应约和同事一起去拜访了一位宜宾有名的厨师。这位70后厨师谈到了90年...
    鱼拜拜阅读 1,456评论 1 1