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选择器(类选择器)
  • 标签选择器
今天心情很不好,暂且就回顾到这里吧。我相信,付出总会有回报的。
夜深人静。

猜你喜欢

转载自blog.csdn.net/qq_40981730/article/details/83448028