三种基本的选择器和命名规范

1. 三种基本的选择器:

   1. class选择器 class=‘box’ .表示class选择器 .box{ css 样式 },支持多个命名(名字)
   2. id选择器: id=“name1” #表示id选择器 #name1{css样式}
      1. 就像身份证号一样,只能有一个,具有唯一性,名字只能出现一次
   3. 标签选择器:标签名{css样式},选择范围广(如果选择p标签,就选择页面中所有的p标签)

2. 通配符: 表示 * 缺点:浪费性能

   1. *{     padding:0;     margin:0;     font-size:20px; } 

3. 单个权重问题: id 选择器>class选择器>标签选择器>通配符选择器

4. 组合选择器:

   1. (子代选择器)层级选择器(后代选择器):―比如:选择器A 选择器 B(css样式) 在满足选择器A 的标签内找到满足选择器B条件的这些标签 设置样式

   2. 子元素选择器(只能是儿子):子元素选择器符号 > 如:ul > li 选择ul的子元素,而不是后代元素(只选择儿子)―缩小选择范围 ,避免样式污染

   3. 兄弟选择器: ~ 如: div ~ p {css样式} 选择div下面所有的兄弟p

   4. 毗邻选择器(邻居选择器): + 只能选择下面的邻居或者兄弟 如div+p 选择div下边相邻的一个p标签

   5. 属性选择器:选择器名[属性名=“属性值”]{ css样式 }

      img[src="02.jpeg"]{     border:2px solid red; } 

      <img src="02.jpeg" alt="你好"> 

5. 命名规范：

   1. 见名知意

   2. 名字不能是汉字，必须是英文的小写

   3. id或者class必须以字母开头，不能以数字或者下划线开头

   4. 不允许单个字母出现！！！不要使用拼音（不符合见名知意）

   5. 不允许带有广告的英文单词出现：如：ad adv adver advertising (防止浏览器当成垃圾广告处理掉 过滤掉 )

   6. 全部小写字母 连字符（ _ ）

   7. 图片地址路径中禁止出现中文,图片命名不能是汉字

转载请标明出处:三种基本的选择器和命名规范

文章来源: https://blog.csdn.net/qq_43380248/article/details/91346091