Python----Web开发初探

Python----Web开发初探

• HTML常用元素入门
• HTML表单
• CSS样式初识
• CSS常用属性
• CSS id/class选择器
• 组合选择器
• 盒子模型

HTML常用元素入门

• 标题
  

---

• 段落
  

---

• 超链接
  

---

• 显示图片
  
  不加width原大小显示，只加一个width可以保证等比例缩放

---

• 表格
  

---

• 有序列表
  

---

• 无序列表
  

• 区块标签

  
  可以把html中多个元素打包变成一个整体，便于移动和更改
  

• 换行


• 加粗

---

HTML表单

    

        
这是右栏

        
  

            
  
                
个人信息
                用户名：  
                密码：
  
                年龄：  
                出生日期：
 
                Sex: 男 女
  
            

            理由：

            
  
            想要的礼物：
             iPhone13  
             Macbook
             camera
             8000块钱
            
生日是哪天:
             
                2011.02.17
                2981.01.25
                2000.01.28
                2000.02.26
            

            

  

        
    

CSS样式初识

css主要是为了渲染html搭建起来的网页骨架

可通过以下方式添加到html中：

1. 内联样式-在html元素中使用style属性
   
   例如div后的style

2. 内部样式表-在html文档头部区域使用style元素来包含CSS
   

把div后的style放在中同一描述，此时所有叫div的元素共用一个CSS样式，所有叫h4的元素共用一个CSS样式

• 外部引用-使用外部CSS文件
  
  

通过中的标签来引用外部创建的test.css文件

---

CSS常用属性

菜鸟教程CSS
Background(背景)
Text(文本)
Fonts(字体)
Border(边框)

Position(定位)
(重点学习以下三)

• fixed
• relative
• static

---

CSS id/class选择器

• id 选择器
  在html标签中加入id属性，这样可以在

  第一层 h1

  第一层p

  第二层 h2

  第二层p

  第二层 h2

  第二层p

  第二层p

  第三层 h3

  第三层p

  我不在层内

  ---

  盒子模型

  div中可以设置样式：
  内边距：padding="3px"
  外边距：margin="30px"
  边框：border = "2px"