HTML2

作者: WANGLIN_HZ | 来源:发表于2018-06-09 17:28 被阅读0次
    • 1、ie6png的修复
    <!DOCTYPE html>
    <html>
    <head>
        <title>ie6png的修复</title>
        <style type="text/css">
            .w{
                height: 700px;
                width: 700px;
                background-image: url(1.jpg);
                background-color: yellow;
                background-repeat: no-repeat;
            }
            .l{
                width: 300px;
                height: 300px;
                background-color: blue;
                background-image: url();
                background-repeat: no-repeat;
            }
        </style>
    </head>
    <body style="background-color: red">
        <div class="w"></div>
        <div class="l"></div>
        <script type="text/javascript"></script>
    </body>
    </html>
    

    • 2、CSS Hack常见的有三种形式:CSS属性Hack、CSS选择符Hack以及IE条件注释Hack, Hack主要针对IE浏览器。
    <!DOCTYPE html>
    <html>
        <head>
            <title>Hack</title>
            <style type="text/css" >
                .test
                {
                    background-color:green;
                }
            </style>
        </head>
        <body>
            <div class="test" style="height:100px; width:100px; line-height:100px; margin:50px; border:1px solid #000;"></div>
        </body>
    <html>
    

    • 3、框架集
    <!DOCTYPE html>
    <html>
    <head>
        <title>框架集</title>
    
    </head>
    <frameset cols="" ="50%,50%">
        <frame src="表单.html"></frame>
        <frame src=""></frame>
        <frameset rows="50%,50%">
            <frame src=""></frame>
            <frame src=""></frame>
            <frame src=""></frame>
    
    </frameset>
    
    </html>
    

    • 4、表单

    1-文本框

    <input type="text" name="name">
    

    2-密码框

    <input type="password" name="pwd">
    

    3-多选框

    <input type="checkbox" name="sports">
    

    4-单选框

    <input type="radio" name="gender">
    

    5-提交按钮

    <input type="submit" value="提交">
    

    6-下拉列表

    <select>
    <option>北京</option>
    </select>
    
    <!DOCTYPE html>
    <html>
    <head>
        <title>表单</title>
        <style type="text/css">
            
        </style>
    </head>
    <body>
        <form action="模拟服务器.html">
            <label form="um">用户名</label>
            <input id="um" type="text" name="wang"><br><br>
            密码<input type="password" name="pwd"><br><br>
            性别<input type="radio" name="gender" value="man">男
            <input type="radio" name="gender" value="woman">女<br><br>
            爱好<input type="checkbox" name="hobby" value="eat">吃饭
            <input type="checkbox" name="hobby" value="play">玩游戏
            <input type="checkbox" name="hobby" value="see">看电影<br><br>
            你喜欢的明星
            <select name="star">
                <optgroup label="男">
                    <option value="szz" selected="selected">宋祖儿</option>
                    <option value="szz">宋祖儿</option>
                </optgroup>
                <optgroup label="女">
                    <option value="szz">宋祖儿</option>
                    <option value="szz">宋祖儿</option>
                </optgroup>
            </select><br><br>
            自我介绍<textarea name="info"></textarea><br><br>
            <input type="submit" value="注册">
            <input type="reset">
            <input type="button" value="按钮"><br><br>
            <button type="submit">提交</button>
            <button type="submit">重置</button>
            <button type="submit">按钮</button>
        </form>
    </body>
    </html>
    

    input

    • input是我们使用的最多的表单项,它可以 根据不同的type属性呈现不同的状态。
    • type属性可选值:
      text:文本框
      password:密码框
      submit:提交按钮
      radio:单选按钮
      checkbox:多选框
      reset :重置按钮
    • fieldset用来为表单项进行分组。
    • legend用于指定每组的名字。
    • label标签用来为表单项定义描述文字。

    效果如下

    QQ图片20180609172533.png

    相关文章

      网友评论

        本文标题:HTML2

        本文链接:https://www.haomeiwen.com/subject/thrteftx.html