第四天——体验CSS

CSS第一天！！！！！

 

体验CSS

    
    
    
    


    
学习CSS第一天

 

一、CSS引入方式：

    
    
    
    
    


    
这是p标签
    .类名 
 
  
2）使用类选择器-->标签添加class=“类名”
 
  
 
 
  



    
    
    
    


    
差异化设置标签！！！

 
  
3、id选择器（一般配合JavaScript使用）
 
  
注意：同一个id选择器一个页面中只能使用一次
 
  
1）定义id选择器-->#id名
 
  
2）使用id选择器-->标签添加id=“id名”
 
  



    
    
    
    


    
测试

 
  
4、通配符选择器
 
  
*，无需调用，浏览器自动设置
 
  
 
  
 三、画盒子
 
  
 
  



    
    
    
    



    >
    
标签1
    
标签2

 
  
 
 
  
 四、文字控制属性
 
  
 
  
1、字体大小（font-size）
 
  
（属性必须有单位，否则属性不生效）
 
  
2、字体粗细（font-weight）
 
  
正常（400）
 
  
加粗（700）
 
  
3、字体倾斜（font-style）
 
  
倾斜：italic
 
  
正常：normal
 
  
4、行高（line-height）
 
  
属性值：1）数字+px
 
  
                2）数字（当前标签font-size属性值的倍数）
 
  
垂直居中技巧：行高属性值等于盒子高度属性值（只适用于单行文字）即：line-height=height
 
  
5、字体族（font-family）
 
  
6、字体复合属性（font）---简写（必须按照顺序书写）
 
  
顺序为-->是否倾斜        是否加粗        字号/行高        字体
 
  
7、文本缩进（text-indent）
 
  
属性值：1）数字+px
 
  
                2）数字+em（推荐：em=当前标签的字号大小）
 
  
例如：p{
 
  
                text-indent：2em；
 
  
}
 
  
8、文本对齐（text-align）
 
  
本质是控制内容的对齐方式，属性要设置给内容的父级！！！
 
  
 
  
9、修饰线（text-decoration）
 
  
 
  
10、颜色（color）
 
  
 
  
 
  
 五、调试