博客列表 >前端用户注册和标签功能

前端用户注册和标签功能

孤忆寻昔R
孤忆寻昔R原创
2019年10月31日 00:11:13710浏览

作业-1

 1。html是超文本标记语言, 用于写页面,能够很好的让协议传输
   http超文本传输协议 相当于请求标准和规范
为了在浏览器上统一界面显示,将用户的请求发送给服务器端,然后准确的显示出想要的浏览信息

实例作业2

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>图片管理</title>
</head>
<body>
    <header>
        <h2>图片制作和链接挑转</h2>
        <ul>
            <li><a href="https://www.php.cn">php官网>>>点击挑转</a></li>
            <li><a href="https://www.baidu.com" target=" _parent">
                <img src="https://www.php.cn/upload/system/000/000/000/5a9111e703515423.jpg" alt="" height="300">
                </a></li>
            <li><a href="https://www.sogou.com/" target="_parent">
                <img src="https://img.php.cn/upload/course/000/000/001/5d2426f409839992.jpg" alt="" height="200">
            </a></li>

        </ul>

    </header>
</body>
</html>
QQ图片20191030235241.jpg

点击 "运行实例" 按钮查看在线实例

实例-作业-3

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表格</title>
</head>

<body>
<h2>PHP中文网商城</h2>
<ul>
    <li>PHP视屏课程</li>
    <li>mysql视频课程</li>
    <li>JavaScript课程</li>
</ul>


<table border="6" cellpadding="20" cellspacing="6" >
    <caption>
        <h1>视频教程</h1>
    </caption>
    <tr>
        <td>上课时间</td>
        <td>课程</td>
        <td>讲师</td>
        <td>内容</td>

        <td colspan="2">主题</td>
    </tr>
    <tr>
        <td rowspan="2">12:00</td>
        <td>mysql</td>
        <td>oppo</td>
        <td >信息</td>

        <td colspan="2">管理</td>
    </tr>
    <tr>
        <td colspan="2" align="center" >管理</td>

        <td colspan="2"><a href="https://www.php.cn" about="" >总十二项>>>点击进入</a></td>
    </tr>
</table>

<footer>
    <h3>这是脚部</h3>
    <ul>
        <li>到此结束</li>
        <li>type.不要点击</li>
        <li>写完了</li>
    </ul>
</footer>
</body>

</html>

QQ图片20191030235233.jpg

实例-作业-4
运行实例 »

实例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户注册</title>
</head>
<body>
    <header>
            <h3 content="">请注册</h3>
    </header>
    <form action="" method="post">
        <p>
            <label for="photo">头像上传:</label>
            <input type="file" name="photo" id="photo">
        </p>
        <p>
            <label for="username">姓名</label>
            <input type="text" id="username" name="username" value="">
        </p>
        <p>
            <label for="email">邮箱</label>
            <input type="text" id="email" name="email" value="">
        </p>
        <p>
            <label for="mobile">电话</label>
            <input type="number" id="mobile" name="mobile" value="">
        </p>
        <p>
            <label for="verify">验证码</label>
            <input type="number" id="verify" name="username" value="">
        </p>
        <p>
            <label for="male">性别:</label>
            <input type="radio" name="gender" id="male"><label for="male">男</label>
            <input type="radio" name="gender" id="female" checked><label for="female">女</label>
            <input type="radio" name="gender" id="secret"><label for="secret">保密</label>
        </p>
        <p>
            <label for="">喜欢什么课程:</label>
            <input type="checkbox" name="hobby[]" value="ability1" id="ability1"><label for="ability1">PHP</label>
            <input type="checkbox" name="hobby[]" value="ability2" id="ability2"><label for="ability2">Javascript</label>
            <input type="checkbox" name="hobby[]" value="ability3" id="ability3"><label for="ability3">mysql</label>
        </p>
        <p>
            <label for="">课程选择:</label>
            <select name="coures" id="">

                <optgroup label="PHP课程">
                    <option value="">mysql</option>
                    <option value="">php</option>
                    <option value="">javascript</option>
                </optgroup>

                <optgroup label="相关联">
                    <option value="">css</option>
                    <option value="">java</option>
                    <option value="">html</option>
                </optgroup>
            </select>
        <p>
            <input type="submit" name="submit" value="提交">
            <input type="reset" name="reset" value="重填">
            <input type="button" name="reset" value="按钮">
            <button type="button">注册</button>
        </p>
    </form>
</body>
</html>
运行实例 »

点击 "运行实例" 按钮查看在线实例

 

QQ图片20191030235224.jpg 

 

实例作业-5

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>网站后台</title>
</head>
<body>
<ul style="float: left;margin-right: 20px">
    <li><a href="4.html" target="content">注册登录</a></li>
    <li><a href="3.html" target="content">商城管理</a></li>
    <li><a href="2.html" target="content">图片管理</a></li>
</ul>
<iframe srcdoc="<h1>很高兴您使用此后台</h1>" frameborder="1" name="content" width="500" height="500"></iframe>
</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

QQ图片20191030235219.png

QQ图片20191030235237.jpg

 实例作业-6

    1、从一定的程度上说语义化标签能够轻松的将html文件规划清晰</li>
    2、简单明晰,能够一眼看出标签的作用
    3、语义化标签更容易让百度蜘蛛抓取,对百度收录有好处

总结小经验

1、ul、td*3 可以得到三个td标签 

2、input.type 能够加速标签速度

声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议