百分百源码网-让建站变得如此简单! 登录 注册 签到领金币!

主页 | 如何升级VIP | TAG标签

当前位置: 主页>网站教程>html5教程> 对于HTML根基的解说
分享文章到:

对于HTML根基的解说

发布时间:09/01 来源:未知 浏览: 关键词:

一、框架标签的简便使用

<!DOCTYPE html><html>
    <head>
        <meta charset="UTF-8">
        <title>框架集标签</title>
    </head>
    <frameset cols="25%,*">
        <frame src="left.html" />
        <frame src="right.html" />
    </frameset></html>

运转结果:

这里写图片描述


二、框架标签利用

<!DOCTYPE html><html>
    <head>
        <meta charset="UTF-8">
        <title>网站后台系统显示页面</title>
    </head>
    <frameset rows="20%,*">
        <frame src="top.html"/>
        <frameset cols="20%,*">
            <frame src="left.html" />
            <frame name = "right" />
        </frameset>
    </frameset></html>

left.html:

<!DOCTYPE html><html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
        <a href="right.html" target="right">会员治理</a><br />
        <a href="#">品牌治理</a><br />
        <a href="#">商品治理</a><br />
        <a href="#">分类治理</a><br />
    <body>
    </body></html>

right.html:

<!DOCTYPE html><html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        所有会员信息    </body></html>

运转结果:
这里写图片描述

三、HTML表单

<!DOCTYPE html><html>
    <head>
        <meta charset="UTF-8">
        <title>表单标签</title>
    </head>
    <body>
        <form action="#" method="get">
            会员名:<input type="text" name="username" placeholder="请输入会员名" size="40px" maxlength="6"/><br />
            密码:<input type="password" name="password"/><br />
            确定密码:<input type="password" name="repassword"/><br />
            性别:<input type="radio" name="sex" value="男"/>男            <input type="radio" name="sex" value="女" checked="checked"/>女<br />
            喜好:<input type="checkbox" name="hobby" value="钓鱼"/>钓鱼            <input type="checkbox" name="hobby" value="打电动"/>打电动            <input type="checkbox" name="hobby" value="写代码"/>写代码<br />
            头像:<input type="file" name="file"/><br />
            籍贯:<select name="province">
                <option>--请选中--</option>
                <option value="北京">北京</option>
                <option value="上海" selected="selected">上海</option>
                <option value="广州">广州</option>
            </select><br />
            自我吹嘘:            <textarea name="自我吹嘘"></textarea><br />
            提交按钮:<input type="submit" value="注册"/><br />
            一般按钮:<input type="button" value="zhuce"/><br />
            重置按钮:<input type="reset" />
        </form>
    </body></html>

运转结果:
这里写图片描述

四、案例注册页面

<!DOCTYPE html><html>
    <head>
        <meta charset="UTF-8">
        <title>注册页面</title>
    </head>
    <body>
        <table border="1px" align="center" width="1300px" cellpadding="0px" cellspacing="0px">
            <tr>
                <td>
                    <table border="1px" width="100%">
                        <tr height="50px">
                            <td width="33.3%">
                                <img src="../img/logo2.png" height="47px"/>
                            </td>
                            <td width="33.3%">
                                <img src="../img/header.png" height="47px"/>
                            </td>
                            <td width="33.3%">
                                <a href="#">登录</a>
                                <a href="#">注册</a>
                                <a href="#">购物车</a>
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
            <tr height="50px">
                <td bgcolor="black">
                    <a href="#"><font size="5" color="white">首页</font></a>
                    <a href="#"><font color="white">手机数码</font></a>
                    <a href="#"><font color="white">电脑办公</font></a>
                    <a href="#"><font color="white">鞋靴香包</font></a>
                    <a href="#"><font color="white">家用电器</font></a>
                </td>
            </tr>
            <tr>
                <td height="600px" background="../img/regist_bg.jpg">
                    <form action="#" method="get">
                        <table border="1px" width="750px" height="400px" align="center" cellpadding="0px" cellspacing="0px" bgcolor="white">
                            <tr height="40">
                                <td colspan="2">
                                    <font size="4">USER</font> &nbsp;&nbsp&nbspREGISTER                                </td>
                            </tr>
                            <tr>
                                <td>
                                    会员名                                </td>
                                <td>
                                    <input type="text" name="user" size="35px"/>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    密码                                </td>
                                <td>
                                    <input type="password" name="password" size="35px"/>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    确定密码                                </td>
                                <td><input type="password" name="repassword" size="35px"/></td>
                            </tr>
                            <tr>
                                <td>
                                    Email                                </td>
                                <td><input type="text" name="email" size="35px"/></td>
                            </tr>
                            <tr>
                                <td>姓名</td>
                                <td><input type="text" name="username" size="35px"/></td>
                            </tr>
                            <tr>
                                <td>性别</td>
                                <td>
                                    <input type="radio" name="sex" value="男"/>男                                    <input type="radio" name="sex" value="女"/>女                                </td>
                            </tr>
                            <tr>
                                <td>出生日期</td>
                                <td>
                                    <input type="text" name="birthday" size="35px"/>
                                </td>
                            </tr>
                            <tr>
                                <td>验证码</td>
                                <td>
                                    <input type="text" name="yzm"/>
                                    <img src="../img/yanzhengma.png"/>
                                </td>
                            </tr>
                            <tr>
                                <td colspan="2">
                                    <input type="submit" value="注册"/>
                                </td>
                            </tr>
                        </table>
                    </td>
                </tr>
                <tr>
                    <td>
                        <img src="../img/footer.jpg"/>
                    </td>
                </tr>
                <tr>
                    <td align="center">
                    <a href="#">关于我们</a>
                    <a href="#">联络我们</a>
                    <a href="#">招贤纳士</a>
                    <a href="#">法律声明</a>
                    <a href="#">友谊链接</a>
                    <a href="#">支付方式</a>
                    <a href="#">配送方式</a>
                    <a href="#">效劳声明</a>
                    <a href="#">广告声明</a>
                    <p>
                        Copyright ? 2005-2018 火之意志 版权所有 
                    </p>
                </td>
                </tr>
            </table>
        </form>
    </body></html>

运转结果:
这里写图片描述
本文讲解了

$.ajax+php实战教程之下拉时主动加载更多文章道理讲解

关于zx-image-view图片预览插件,支撑扭转、缩放、移动的相关操纵

讲解微信小程序开发根基篇之第一课

以上就是关于HTML根基的讲解的具体内容,更多请关注百分百源码网其它相关文章!

打赏

打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,你说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

百分百源码网 建议打赏1~10元,土豪随意,感谢您的阅读!

共有151人阅读,期待你的评论!发表评论
昵称: 网址: 验证码: 点击我更换图片
最新评论

本文标签

广告赞助

能出一分力是一分吧!

订阅获得更多模板

本文标签

广告赞助

订阅获得更多模板