html回忆杀--语法

2023-05-19,

HTML概述:

html主要做网页的页面,

我们看到的同一个页面显示不同的数据,则是通过JS,VBS,等语言把数据库的数据写入到Html文件

在python中通过WEB框架把数据动态更新到HTML模板中。

HTML文档结构:

    标签:组成html其本的元素,每个标签都有自己的属性,可以通过JS,CSS重定义。

    块级标签:占用一整行或一个区域,如div、p

    行级标签:占用行内的一部分

    主动闭合标签:前后必须对应<标签名>内容</标签名>

    自闭合标签:不需要有后面的,自闭合标签一般都是设置属性。<标签名 \>

    body中的标签是可以嵌套的

<html>
    <!--注释-->
    <head>
        <!-- 此处放置html文档属性标签,不在网页中显示
        meta 标签:    可设置的功能:定义编码,跳转,刷新,关键字,描述,设置兼容
        title 标签:   设置网页上方显示的标题
        link 标签:    网页标题前面的小图标
        style 标签:   定义CSS样式表
        Script标签:   定义脚本语言
        
        -->
    </head>
    <body>
        <!--此处的标签都是在网页中显示的
        占位符: html中有部分符号不显示,使用占位符才能正确显示
                &nbsp空格、&gt大于号、&lt小于号、等等...
        P标签:  段落,段落间有间距,<p>hello</p>
        br:   换行,行间没有间距,<br>
        h标签:   加粗并指定字号。<h2>word</h2>,h2~h7
        
        input标签:<input></input>
            type属性定义了input类型
            name定义了input控件名字,方便调用
            value定义了默认值
            
            type类型:
                text: 文本框,name,value
                password: 密码,neme,value
                submit: 提交按钮,value
                button: 普通按钮,可以通过JS或VBS改写动作,value
                radio: 单选框,实现单选效果需要把所有的radio定义相同的name,name,value,checked='checked'
                checkbox: 复选框,name,value,checked='checked'
                file:上传文件,依赖form表单的属性enctype='multipart/form-data'
                reset:重置表单按钮
        
        textarea标签:多行文本框,name定义名字,默认值写在开始和结束标签中间。<textarea>默认值<\textarea>
        
        select标签:下拉菜单
            option定义下拉选项,内部的value定义了传递值,默认显示值在option开始和结束之间
            size框里显示的选项数量
            multiple可多选,<select multiple>
                
        a标签:
            href定义超链接地址或#锚点
            #id 跳转到内部id标签位置
            网址 跳转到指定网址 href='http://www.apple.com'
          target定义新打开的页面方式
              自定义名字,例如给frame框架设定个名字,在target输入frame名字,链接就会在指定的frame打开。
              _self 默认,当前窗口打开
              _blank 打开一个新窗口
              _parent 在父框架集中打开被链接文档。
              _top 在整个窗口中打开被链接文档。
              
        img 标签: 插入图片 <img /><div id='1' style=height:600px><img src="./捕获.PNG" alt="lala" title="play man" /></div>
            src    图片位置
            alt    图片打不开时,提示的文字
            title 鼠标悬浮在图片上显示的文字提示
        
        列表:
            ul 单层列表,前面以符号标记,li
            ol 单层列表,前面以数字标记,li
            dl 双层列表,dt一层,dd二层 
           
        table表格:
               <table> </table> border=1,表格线宽,thead,tbody,tfoot可以用来定义式样。
             thead表头
                 tr 行 
                     td 列 colspan=2 合并两列为一列,rowspan=2 合并两行为一行,需要删除对应的单元格标签
             tbody表内容
                 tr 行
                     td 列 
             tfoot页脚                
                 tr 行
                    td 列                
             
        label 用户点击label,与label关联的控件获取光标,label名与控件名一致,代表关联
            <label for='username'>用户名</label>
            <input type='text' id='username' name='user'/>    
        
        fieldset 设置带字边框
            legend 设置文字 <legend> </legend>
            
            
        -->
    <body>
    
</html>

《html回忆杀--语法.doc》

下载本文的Word格式文档,以方便收藏与打印。