菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育

标题: 蒋鹏冲-20221012-CSS1 [打印本页]

---

作者: 北纬33    时间: 2022-10-12 23:41
标题: 蒋鹏冲-20221012-CSS1

• CSS的基本概念
  
  • CSS是层叠样式表（Cascading Style Sheet）的简称，CSS也是一种标记语言，可以给HTML书写出来的网页设置不同的样式
    
• CSS的语法规范
  
  • h1 {color:red; font-size:14px;}
    
  • 语法注意点
    
    • 1、选择器是用于指定CSS样式的HTML标签，{}里面是对该选择器设置的具体样式
      
    • 2、属性和属性值是以“键值对”的形式出现
      
    • 3、属性是一种特定的样式属性，例如：字体颜色，字体大小等等
      
    • 4、属性和属性值之间要用英文的“:”隔开
      
    • 5、多个“键值对”之间要用英文的";"来隔开
      
  • 样式一般写在head标签中的style标签内（练习样式时的主要用法）
    
• CSS的基础选择器
  
  • 标签选择器（元素选择器）
    
    • 标签选择器是指用HTML标签名作为选择器，对页面中所有的符合条件的一类标签来指定统一的CSS样式。
      
    • 语法：
      
    • 优点：
      
      • 能快速设置页面中一类标签的样式
        
    • 缺点
      
      • 不能差异化设置样式
        
  • 类选择器
    
    • 差异化选择不同的标签，可以使用类选择器
      
    • 语法：
      
    • 语法注意：
      
      • 1、类选择器用英文的“.”来进行定义，后面要跟类名
        
      • 2、长类名一般可以用横线来进行连接
        
      • 3、不要使用纯数字、中文等进行命名，要使用英文字母来命名
        
      • 4、类的命名要有意义，尽量使他人一眼就知道这个类名的目的
        
    • 多类名的使用
      
      • 1、在标签class属性中写多个类名可以进行多类名调用
        
      • 2、多个类名之间要用空格隔开
        
      • 3、调用完后就会显示所有被调用类名所声明的样式
        
      • 例
        
  • ID选择器
    
    • 什么是id选择器
      
      • id是唯一标识，所以id选择器主要是为了唯一的id的HTML元素来指定特定的样式
        
      • id选择器用"#"来进行定义，用id来进行调用
        
    • 例
      
    • id选择器和类选择器之间的区别
      
      • 1、类选择器好比人名，一个人可以有多个名字，同一个名字也可以被多个人使用。
        
      • 2、id选择器相当于身份证号码，全国唯一，不得重复
        
      • 3、id选择器在一个网页中只能使用一次，类选择器可以使用多次
        
      • 4、类选择器在修改样式中使用的频率最高，id选择器一般用于页面的唯一性的元素上，经常搭配JS来使用
        
  • 通配符选择器
    
    • 在CSS中，通配符选择器用“*”来定义，它表示选择页面中的所有元素。
      
    • 例
      
    • 通配符选择器不需要进行调用，可以直接给所有的元素设置样式
      

---

欢迎光临 菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育 (http://www.xingmaxueyuan.com/)

Powered by Discuz! X3.4