s14 HTML笔记

HTML

____oldboy python s14

1、一套规则，浏览器认识的规则。
2、开发者：
    学习Html规则
    开发后台程序：
        - 写Html文件（充当模板的作用） ******
        - 数据库获取数据，然后替换到html文件的指定位置（Web框架）
3、本地测试
    - 找到文件路径，直接浏览器打开
    - pycharm打开测试
4、编写Html文件
    - doctype对应关系
    - html标签，标签内部可以写属性 ====> HTML标签只能有一个
    - 注释：  <!--  注释的内容  -->
5、标签分类
    - 自闭合标签
        <meta charset="UTF-8"/>
        推荐加‘/‘
    - 主动闭合标签
        <title>老男孩</title>
6、head标签中
    - <meta>  ==> 编码，跳转，刷新，关键字，描述，IE兼容
      < meta http-equiv=“content-type” content=“text/html;charset=utf-8”>
      < meta http-equiv=”Refresh“ Content=”5; Url=http://www.autohome.com.cn“ />
      < meta name="keywords" content="星际2,星际老男孩,专访,F91,小色,JOY" >
      < meta http-equiv="X-UA-Compatible" content="IE=IE9;IE=IE8;" />
    - title标签
    - <link /> 网站图标，欠
    - <style />欠
    - <script> 欠
7、body标签
    - 图标（符号）：&nbsp; 空格 &gt; 大于号 &lt; 小于号
      各种符号
      http://www.cnblogs.com/web-d/archive/2010/04/16/1713298.html
    - p标签：段落
    - br标签：换行
    - h系列：h1最大，h6最小
    - div：用处最多
    - span：行内
    ======== 小总结  ========
    所有标签分为：
        块级标签： div（白板），H系列（加大加粗），p标签（段落间有间距）
        行内（内敛）标签： span（白板）
    标签之间可以嵌套
    标签存在的意义：css操作，js操作
    ps:chorme审查元素的使用
        - 定位
        - 查看样式
    =========================
    
    - input系列 + form标签
        input type='text'     - name属性，value="赵凡"  #默认值
        input type='password' - name属性，value="赵凡"
        input type='submit'   - value='提交' 提交按钮，表单
        input type='button'   - value='登录' 按钮
        
        input type='radio'    - 单选框 value不同，checked="checked"，name属性（相同则互斥）
        input type='checkbox' - 复选框 value不同, checked="checked"，name属性（相同批量获取数据）
        input type='file'     - name='' 依赖form表单属性 enctype="multipart/form-data"
        input type='reset'    - 重置

        <textarea >默认值</textarea>  - name属性
        select标签            - name属性,内部option value提交到后台，
                              - selected=’selected‘，size，multiple，optgroup分组
        
        form标签属性：
            <form action='url' method="GET" enctype="multipart/form-data> <form/>
            # GET（默认）:URL中发送,POST:内容中发送
            # GET: http://sssss?q=用户输入的值
                  http://sssss?q=用户输入的值&b=用户输入的内容
    - a标签
        - 跳转   行内标签 target属性   target='_blank'新窗口打开
        - 锚     href='#某个标签的ID'    标签的ID不允许重复            
    - img标签
         src 图片地址
         alt 找不到图片时显示内容
         title 鼠标指到时显示内容            
    - 列表
        ul        # 无序
            li
        ol        # 有序
            li
        dl        # 分层
            dt  # 层级
            dd
    - 表格
        table    border=
            thead        #表头
                tr        
                    th
            tbody        #表格
                tr
                    td
        colspan = 'n' 横跨n格   rowspan = 'm' 纵跨m格
    - label
        用于点击文字，使得关联的标签获取光标
        <label for="username">用户名：</label>
        <input id="username" type="text" name="user" />
    - fieldset 一般用不着
        legend