HTML笔记

一套规则,浏览器认识的规则，常用20个标签
开发者：
    学习html规则
    开发后台程序：
        - 写html文件（充当模板）
        - 数据库中获取数据，替换html文件指定位置（web框架）
本地测试
    - 浏览器直接打开
    - pycharm服务器
编写htnl文件
    - doctype 对应关系
    - htnl标签，标签内部可以写属性 ,只能有一个
    - 注释``
标签分类
    - 自闭合标签``
    - 主动闭合标签` `
head标签
    - meta标签 编码，跳转，刷新，关键字，描述，ie兼容
   ` `优先由高版本打开
    - title 标题
    - link  图标
    - style
    - script
body标签
    - 特殊符号   空格 ` `   大于号` > ` 小于号` <`
    - 参考：http://tool.oschina.net/commons?type=2
    - p标签：段落   br标签：换行推荐写法：`
`
    - h1-h6
    标签总结：
        - 块级标签（占满一行） h(加大加粗),p（段落之间有间距）,div（白板）
        - 行内标签（内联标签，沾满内容）span（白板）
    标签之间可以嵌套
    标签存在的意义，css操作，js操作
    浏览器的审查元素
        - 定位
        - 查看样式
input标签
    type
        text 文本  name  value
        password 密码  name value
        submit 提交  value
        button 按钮 value
        radio  单选框 name(相同则互斥)  value  默认选中checked="checked"
        checkbox 复选框  name 批量获取数据 value 默认选中
        file 文件  依赖于：form属性 enctype="multipart/form-data"
        reset 重置
    textarea 多行文本
    select 下拉框
        - selected默认选中
        - size 选中个数
        - multiple 多选
        - optgroup 分组显示
a标签
    - 跳转
    - 锚点 href="#标签id"  标签id不允许重复
img标签
    - src图片地址  alt图片失效文字  title提示文字
列表
    - 无序列表ul  li
    - 有序列表ol  li
    - 定义列表dl  dt dd
表格table
    - 表头thead tr  th
    - 表体tbody tr  td
    合并列 colspan
    合并行 rowspan
label标签
    -与input配合使用，点击文字，使得关联标签获得光标
fieldset  字段框  legend 标题

代码实例

头部示例

    
    
    
    
    
    
    Title


    hello world
        time:{{time}}  {time}}会在服务器端被替换掉-->

输入框

    
    Input



    
        
            输入信息
            输入框：
            用户名： 
            

            密码框：
            密码：
        
        性别（单选框）：
        男：
        女：

        爱好（复选框）：
        篮球：
        足球：

        上传文件
        

        多行文本输入
        默认值

        下拉框
        默认显示
        
            北京
            上海
            广州
        
        默认选中
        
            北京
            上海
            广州
        
        显示个数
        
            北京
            上海
            广州
        
        多行选择
        
            北京
            上海
            广州
        
        分组显示
        
            
            北京
            上海
            
            
            广州
            深圳
            
        
    
    
    

显示效果：

a标签

    
    Title


第一章
第二章
第三章
第四章

第一章
第二章
第三章
第四章

百度接口

    
    Title



    
        
        
    

img图片

    
    Title

列表

    
    Title


无序列表

    项目
    项目
    项目

有序列表

    项目
    项目
    项目

定义列表

    标题
    描述
    描述
    标题
    描述
    描述

显示效果

登陆

    
    Login


    
        
        
        
        
        
        
    

显示效果

表格

    
    Title



    
        
            表头
            表头
            表头
        
    
    
        
            第二行，第一列
            第二行，第二列
            第二行，第三列
        
        
            行合并
            第二行，第二列
            第二行，第三列
        
        

            列合并
        
    

显示效果