zoukankan      html  css  js  c++  java
  • html常用标签

    元素:开始标签,元素内容,结束标签的所有代码

    input、a、img、table、p、br、div、span、h1-h6、lable、ul、ol、dl、select、textarea、form

    head:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <link>
        <style></style>
        <script></script>
    </head>

    body:

    <body>
    &nbsp;空格 &gt;大于号 &lt;小于号
    
    <p>段落<br>段落内换行</p>
    
    <h1>lyb</h1>
    <h2>lyb</h2>
    <h3>lyb</h3>
    <h4>lyb</h4>
    <h5>lyb</h5>
    <h6>lyb</h6>
    
    <span>lyb</span>
    <span>lyb</span>
    <span>lyb</span>
    
    <div>lyb</div>
    <div>123</div>
    -------------------------
    标签分:
    块级标签:div(白板,一般配合css)H系列(加大加粗),P标签(段落间有间距)
    行内标签(内敛标签):span标签(白板,没有特性,一般配合css使用)、a标签
    标签间可以嵌套 标签存在的意义,便于css操作,js操作

    表单,提交数据到后台:

    <form action="" method="get" enctype="multipart/form-data">  # action指表单提交到的地址,不写默认到当前url,method指提交方式有get,post,默认get方式 
        <div>
            <input type="text" name="user" value="这是默认值">
            <input type="password" name="pwd" value="这是默认值">
    <p>性别</p><input type="radio" name="gender" value="1">  #单选的复选框,name一致用于互斥<input type="radio" name="gender" value="2">
    <p>爱好</p> 篮球<input type="checkbox" name="ball" value="1">  #多选的复选框 足球<input type="checkbox" name="ball" value="2" checked>  # checked 默认勾选 棒球<input type="checkbox" name="ball" value="3"> 台球<input type="checkbox" name="ball" value="4"> 冰球<input type="checkbox" name="ball" value="5">
    <p>上传文件</p>  #注意form中的enctype=“multipart/form-data” <input type="file" name="fname"> <textarea name="meno">多行文本,这里是提交文本书写处,默认值</textarea> <select name="city" size="10" multiple>  #size显示框的多少,multiple可以按ctrl多选 <option value="1">北京</option> <option value="2">上海</option> <option value="3">河南</option> <option value="4">洛阳</option> </select> <input type="submit" value="提交1"> <input type="button" value="提交2"> <input type="reset" value="重置">  #button配合js使用 </div> </form>

    a标签作用:跳转、锚

    #跳转   target=“_blank”在新页面显示
    <a href="http://www.baidu.com" target="_blank">baidu</a>  
    
    #锚 在本页跳至指定位置 id是唯一的 <a href="#i1">第1章</a> <a href="#i2">第2章</a> <a href="#i3">第3章</a> <a href="#i4">第4章</a> <div id="i1" style="height: 600px">第章1内容</div> <div id="i2" style="height: 600px">第章2内容</div> <div id="i3" style="height: 600px">第章3内容</div> <div id="i4" style="height: 600px">第章4内容</div>

    img:

    <a href="http://www.baidu.com">
        <img src="1.png" title="大苹果" style="height: 100px; 100px;" alt="苹果" >
    </a>

    列表:ul、ol、dl

    <ul>
        <li>kdjfl</li>
        <li>ejtrek</li>
    </ul>
    <ol>
        <li>kdjfl</li>
        <li>ejtrek</li>
    </ol>
    <dl>
        <dt>ewr</dt>  #靠外一层
        <dd>klfj</dd>
        <dd>wwwr</dd>
    </dl>

    table:

    <table border="1">
        <thead>  
            <tr>
                <th>姓名</th>  #th加粗,td不加粗
                <th>年龄</th>
                <th>性别</th>
                <th>爱好</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>张三</td>
                <td colspan="2">15  男</td>  #使用合并要删除多余单元格
                <td>爬山</td>
            </tr>
            <tr>
                <td>王莹</td>
                <td rowspan="2">18</td>
                <td></td>
                <td>游泳</td>
            </tr>
            <tr>
                <td>李四</td>
                <td></td>
                <td>旅游</td>
            </tr>
        </tbody>
    </table>

    lable配合input

    <label for="user">用户:</label>  #for后与input关联,点击用户和点击输入框同等效果
    <input id="user" type="text" name="username">
    </body>
    </html>
    渐变 --> 突变
  • 相关阅读:
    ios开发中超简单抽屉效果(MMDrawerController)的实现
    mysql的查询、子查询及连接查询
    iOS在线音乐播放SZKAVPlayer(基于AVPlayer的封装)
    iOS js oc相互调用(JavaScriptCore)(二)
    Linux下面如何安装Django
    国内外测绘遥感领域核心期刊
    MFC程序消息处理的顺序
    VC++中关于控件重绘函数/消息 OnPaint,OnDraw,OnDrawItem,DrawItem的区别
    C#中控件Control的Paint事件和OnPaint虚函数的区别
    Lambda表达式学习(2)
  • 原文地址:https://www.cnblogs.com/lybpy/p/8109040.html
Copyright © 2011-2022 走看看