HTML基础

Posted 2021-11-25 xiezuodd

html
    head常用标签:
        title:定义网页标题 显示在浏览器最上面的内容
        style:定义内部样式表
        script:定义js代码或者引入外部js文件
        link:引入外部样式表文件或者网站图标
        meta:定义网页原信息
    body标签:
        基本标签:
            <b>: 加粗</b>
            <i>: 斜体</i>
            <u>:下划线</u>
            <s>:删除线</s>

            <p>段落标签</p>

            <h1>标题1</h1>
            <h2>标题2</h2>
            <h3>标题3</h3>
            <h4>标题4</h4>
            <h5>标题5</h5>
            <h6>标题6</h6>

            <br> 换行
            <hr> 下划线
            <!----> 注释
            <!--
            多行注释
            -->

        特殊符号:
            &nbsp; 空格
            &gt; >
            &lt: <
            &amp; &
            &yen; ￥
            &copy;
            &reg;

        div标签与span标签:
            div标签用来定义一个块级元素 没有实际意义 主要通过CSS样式为其赋予不同的表现形式.
            span标签用来定义行内元素 没有实际意义 主要通过CSS样式为其赋予不同的表现形式.

        块级标签与行内标签:
            块级标签:
                1.块级标签可以嵌套块级标签和行内标签  例如:h1~h6,p,hr,br,div
                2.p标签也是块级标签 但是不能嵌套块级标签 只能嵌套行内标签
            行内标签:
                1.行内标签只能嵌套行内标签
                2.行内标签不能设置长宽

        img标签:
            <img src="图片路径" alt="图片未加载成功时的提示" title="鼠标悬浮时提示信息"
            width="宽" height="高"(宽高两个属性只用一个会自动等比缩放)>

        a标签:
            <a href="https://www.baidu.com" target="_blank">点我</a>
            target:打开新页面
        
        URL是什么:
            URL是统一资源定位符(Uniform Resource Locator)的缩写,也被称为网页地址,是英特网上标准
            的资源的地址
            
        列表标签:
            无序列表
                ul>li 
                    type disc,none,square,circle
            有序列表:
                <ol type="i">
                    <li>aaa</li>
                    <li>bbb</li>
                    <li>ccc</li>
                </ol>
            标题列表:
                <dl>
                    <dt>标题1</dt>
                    <dd>内容1</dd>
                    <dd>内容2</dd>
                    <dd>内容3</dd>
                    <dt>标题2</dt>
                    <dd>内容1</dd>
                    <dd>内容1</dd>
                    <dd>内容1</dd>
                    <dt>标题3</dt>
                    <dd>内容1</dd>
                    <dd>内容1</dd>
                    <dd>内容1</dd>
                </dl>
        
        表格标签
            <table>
                <thead></thead>
                <tbody></tbody>
            </table>
            
            table内 tr标签表示一行,tr里面可以放td,thead
            
            
            
            
            
        form表单(*******)
            功能:前后数据交互,帮你提交任意的数据
        
        input通过控制type属性来展示不同的获取用户输入的页面效果
            type属性总结:
                text:纯文本
                password:用户输入不可见
                date:日期    比如:获取用户生日
                radio:单选 比如:获取用户性别
                checkbox:多选 比如:获取用户爱好
                file:文件  获取用户上传文件
                
                submit:提交  注意:form表单中只有input的type属性是submit才能支持提交
                reset:重置
                button:按钮
        
        select:下拉框 默认是单选,可以通过multiple属性指定为多选
        
        textarea:大段文本
        
        
        
        label标签
            本身没有任何实际意义,主要是配合input标签
            <label for="">username:
                <input type="text">
            </label>
            
            <label for="i1">username:
                <input type="text" id="i1">
            </label>
        
    flask框架初窥
        flask安装命令
            pip install Flask
            
        flask三行式
            
        请求方式
            获取数据 get请求
            提交数据 post请求
        
        
    标签分类(******)
            块儿级标签(独占一行) h1~h6,p,hr,br
                1.块儿级标签,可以嵌套其他块儿级标签和行内标签
                2.p标签虽然也是块儿级标签,但是它不能嵌套任何块儿级标签,只能嵌套行内标签
                
            行内标签(自身文本多大就占多大) span,b,u,i,s,a,img
                1.行内标签肯定不能嵌套块儿级标签,只能嵌套行内标签
                2.行内标签 无法设置长宽
                
    标签分类2:
        双标签<h1></h1>
        自闭和标签<img />
            
            
    URL:网址(uniform resource locator)
        专业一点:统一资源定位符
        url的组成:
            https://www.baidu.com/
            
            
    form表单中
        action属性. 控制数据往哪提交,不写默认往当前url地址提交
        method属性  控制数据提交的方式,默认是get请求,可以通过method该属性指定其他提交
        提交数据的input必须要有name参数
        input框中value属性就是对应的值
    
        如果要提交文件数据
            1.修改提交数据编码格式enctype
            2.提交方式必须是post
    
            
    form表单注意事项:
        action
        method默认是get
        enctype数据编码格式
        form表单获取用户输入的标签都必须有name属性
        form提交数据必须借助于input标签type类型等于submit按钮才能触发提交效果