• day12-HTML


    
    

    HTML(超文本标记语言)

    
    

    html代码实际上就是一套能够被浏览器所识别的规则代码,由一个个标签组成。html代码就是一大长串字符串,而这种字符串的格式正好能够被浏览器所识别,也就有了我们的WEB页面。

    
    

    后端与前端交互方式

    
    

    1、后端通过直接返回浏览器能够识别的html代码

    
    

    2、后端返回数据,前端替换html种的指定数据


    文本标签text以及select选择框标签
        <div id="i1" class="c1"></div>
    <input type="text" name="age" value="19">
    <input type="hidden" name="age" value="18"> 隐藏input 提交的载具 不显示 {'name':value}
    <input type="password"> 隐藏的文本
    <input type="checkbox"> 多选框
    <input type="radio"> 单选框
    <input type="reset"> 必须与form表单连用才能有重置的效果
    <input type="button"> 只是一个按钮 没有任何作用
    <input type="submit">与form表单连用 有提交的功能
    <textarea name="age">11111111</textarea> 多行文本
    <form method="post" action="">

    </form>
    <label for="i1">用户名</label>
    <input type="text" id="i1">
    <select name="" size="2" multiple="multiple">
    <option value="">1</option>
    <option value="" selected="selected">2</option>
    <option value="">3</option>
    </select>
    <a href="http://www.imdsx.cn">大师兄</a>
    <input type="checkbox" name="age">,
    <input type="checkbox" name="age">
    <input type="checkbox" name="age">{'age':[1,2,3]}
    <input type="radio" name="age">
    <input type="radio" name="age">
    <!--innerHtml 获取div标签中的所有内容 包括html代码-->













    <!DOCTYPE html>

    <html lang="en">
    <head>
    <!--自闭合标签:没有另一半,自动闭合-->
    <!--主动闭合标签:有另一半叫主动闭合标签-->
    <!--head当中 大多数标签是看不到的-->
    <meta charset="UTF-8">

    <!--间隔x秒后,跳转到指定url-->
    <meta http-equiv="refresh" content="3;url='http://www.nnzhp.cn'">

    <!--关键字检索-->
    <meta name="keywords" content="大师兄,牛牛">

    <!--网站描述-->
    <meta name="description" content="j">

    <!--浏览器tag的名字-->
    <title>璐璐</title>

    <!--tag标签的图片-->
    <link rel="shortcut icon" href="logo.jpg">

    <!--欠着-->
    <!--<link rel="stylesheet" href="">-->
    <!--<style></style>-->
    <script></script>
    </head>
    <body>
    </body>
    </html>








    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>Title</title>
    </head>
    <body>
    <!--标题标签-->
    <!--<h1>h1标签</h1>-->
    <!--<h2>h1标签</h2>-->
    <!--<h3>h1标签</h3>-->
    <!--<h4>h1标签</h4>-->
    <!--<h5>h1标签</h5>-->
    <!--<h6>h1标签</h6>-->
    <!--白板标签-->
    <!--没有任何css的样式-->
    <!--内联标签真白板标签-->
    <!--有多大占多大-->
    <!--<span>这是span标签</span>-->
    <!--<span>这是span标签</span>-->
    <!--这是我写在标签外面的内容-->
    <!--块级伪白板标签-->
    <!--无论有多大都占一行-->
    <!--<div>这是div标签</div>-->

    <!--段落标签-->
    <!--换行标签-->
    <!--<p>这是span标签 这是span标签 这是我写在标签外面的内容这是span标签-->
    <!--<br/>这是span标标签 这是我写在标签外面的内容这是span标签 这是span标签-->
    <!--这是我写在标签外面的内容这是span标签 这是s标签 这是我写在标签外面的内容</p>-->
    <!--<p>这是span标签 这是我写在标签外面的内容这是span标签 这是span标签 这是我写在标签外面的内容</p>-->
    <!--输入框 input-->
    <!--<input type="text" name="username" value="" placeholder="请输入用户名">-->
    <!--<input type="password" name="passwd">-->
    <!--多选框 checked 默认勾选-->
    <!--<input type="checkbox" name="" checked="checked">-->
    <!--radio name字段 相同时,单选框互斥-->
    <!--<div>-->
    <!--<span>男</span><input type="radio" name="sex">-->
    <!--</div>-->
    <!--<div>-->
    <!--<span>女</span><input type="radio" name="sex" >-->
    <!--</div>-->
    <!--form 表单提交会刷新页面 ajax不会刷新页面-->
    <!--<form action="s.html" method="post">-->
    <!--<input type="checkbox" checked="checked">-->
    <!--<input type="text" name="username" value="">-->
    <!--&lt;!&ndash;没有任何外加操作&ndash;&gt;-->
    <!--<input type="button" value="增加">-->
    <!--&lt;!&ndash;与form表单连用,会提交form表单中的数据&ndash;&gt;-->
    <!--<input type="submit" value="提交">-->
    <!--<input type="reset">-->
    <!--</form>-->



    !!!!!
    <!--label 与input 连用 通过for 属性 映射到input的id属性-->
    <!--<label for="i1">用户名:</label>-->
    <!--&lt;!&ndash;id属性是选择器&ndash;&gt;-->
    <!--<input id="i1" placeholder="请输入用户名" name="username" type="text">-->
    <!--多行文本-->
    <!--<textarea name="content">这是textarea的内容</textarea>-->

    <!--select 下拉框标签-->
    <!--<select name="city" size="1" multiple="multiple">-->
    <!--<option value="1">黑龙江</option>-->
    <!--<option value="2" selected="selected">河北</option>-->
    <!--<option value="3">河南</option>-->
    <!--</select>-->
    <!--<select multiple="multiple">-->
    <!--<optgroup label="黑龙江">-->
    <!--<option>牡丹江</option>-->
    <!--<option>哈尔滨</option>-->
    <!--<option>鸡西</option>-->
    <!--</optgroup>-->
    <!--<optgroup label="河北">-->
    <!--<option>保定</option>-->
    <!--<option>石家庄</option>-->
    <!--<option>涞水</option>-->
    <!--</optgroup>-->
    <!--</select>-->
    <!--<a href="http://ui.imdsx.cn" target="_blank" style="text-decoration:none">大师兄博客</a>-->
    <!--alt属性代表当图片加载失败,所展示的文案 title鼠标悬浮的logo-->
    <!--<img src="logo.jpg" alt="这是logo" title="logo">-->
    <!--列表标签-->
    <!--<ul>-->
    <!--<li>用例名称</li>-->
    <!--<li>用例方法</li>-->
    <!--<li>返回参数</li>-->
    <!--</ul>-->
    <!--数字列表-->
    <!--<ol>-->
    <!--<li>用例名称</li>-->
    <!--<li>用例方法</li>-->
    <!--<li>返回参数</li>-->
    <!--</ol>-->
    <!--<dl>-->
    <!--<dt>黑龙江</dt>-->
    <!--<dd>牡丹江</dd>-->
    <!--</dl>-->
    <!--<dl>-->
    <!--<dt>河北</dt>-->
    <!--<dd>保定</dd>-->
    <!--</dl>-->

    <!--表格标签-->
    <table border="1">#border 是边框厚度
    <thead>
    <tr>
    <th>id</th>
    <th>caseName</th>
    <th>Method</th>
    <th colspan="2">操作</th>#colspan代表着要占多少列
    </tr>
    </thead>
    <tbody>
    <tr>
    <td>1</td>
    <td rowspan="3">抽奖</td>#rowspan代表着要占多少行
    <td rowspan="3">post</td>
    <td>编辑</td>
    <td>删除</td>
    </tr>
    <tr>
    <td>2</td>
    <td>编辑</td>
    <td>删除</td>
    </tr>
    <tr>
    <td>3</td>
    <td>编辑</td>
    <td>删除</td>
    </tr>
    </tbody>
    </table>

    1、主动闭合和自闭合
    <input>
    <span></span>
    2、什么是块级标签 什么是内联标签 又交行内标签
    <input>
    <div></div>
    <img src="../../学习/视频/天蝎座/day12/SYZtester/logo.jpg">
    3、出场率最高的标签
    伪白板标签 display:block 块级标签属性
    <div></div>
    真白板标签
    <span></span>
    4、form input
    5、select

    </body>
    </html>
  • 相关阅读:
    JBOSS管理数据库连接
    PowerDesigner使用教程 —— 概念数据模型
    VC Delphi WM_COPYDATA 消息
    VC Delphi WM_COPYDATA
    DELPHI实现键盘勾子
    设置window任务管理器是否可用
    VS2005 MFC使用
    隐藏显示任务栏
    DELPHI实现键盘勾子
    MSN、腾讯QQ、SKYPE、阿里旺旺网页在线客服源代码
  • 原文地址:https://www.cnblogs.com/flynn0825/p/8660611.html
Copyright © 2020-2023  润新知