CSS基础介绍笔记1

官方文档

• CSS指的是层叠样式（Cascading Style Sheets）
• 地址：CSS 教程
• 离线文档：放大放小：ctrl+鼠标滚动
• 为什么需要css：简化修改HTML元素的样式；将html页面的内容与样式分离提高web开发的工作效率（针对前端开发）；可以让html元素（内容）+样式（CSS）分离，更好控制页面

css快速入门

应用实例simple_css.html,使用css完成下面页面

完成如下网页显示

  
    
    
    
    
  
  
    
    
hello,北京
    

    
hello,上海
    

    
hello,天津
    

  

css语法

1.css语法可以分为两部分：（1）选择器（2）声明

2.声明由属性和值组成，多个声明之间用分号分隔

3.最后一条声明可以不加分号（建议加上）

4.一般每行只描述一个属性

5.css注释：/*注释内容*/，类似java

  
    
    
    
    
  
  
    
    
hello,北京
    

    
hello,上海
    

    
hello,天津
    

  

常用样式-字体颜色

介绍

颜色可以颜色名，比如green，也可以写rgb值，比如rgb（200，200,200）和十六进制表示值，比如#708090（使用十六进制更多）

应用实例 color.html

  
    
    
    
    
  
  
    
努力学习
  

常用样式-边框border

应用实例border.html

  
    
    
    
  
  
    
学习
  

常用样式-宽度width/高度height

宽度/高度像素值：100px；也可以是百分比值：50%；

应用实例，如上所示

常用样式-背景颜色

  
    
    
    
  
  
    
学习
  

常用样式-字体样式

1.font-size：指定大小，可以按照像素大小

2.font-weight：指定是否粗体

3.font-family：指定类型

  
    
    
    
  
  
    
学习
  

常用样式-DIV居中

  
    
    
    
  
  
    
学习
  

常用样式-文本居中

  
    
    
    
  
  
    
学习
  

常用样式-超链接去下划线

  
    
    
    
    
  
  
    点击到百度
  

常见样式-表格细线

  
    
    
    
  
  
    

      

        
        
第1行第1列
      
      

        
        
第2行第1列
        
第2行第2列
        
第2行第3列
      
      



        
第3行第2列
        
第3行第3列
      
      

        
        
第4行第1列
        
第4行第2列
        
第4行第3列
      
      

        
第5行第2列
        
第5行第3列
      
    
  

常用样式-列表去修饰

  
    
    
    
  
  
    

      
三国演义
      
红楼梦
      
西游记
      
水浒传