JavaWeb之Html

文本标签 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>文本标签</title>
</head>
<body>
<!-- 注释-->
黑马旅游网
<h1>黑马旅游网</h1>
<h2>黑马旅游网</h2>
<h3>黑马旅游网</h3>
<!-- 段落标签p -->
<p>黑马旅游网黑马旅游网黑马旅游网黑马旅游网黑马旅游网黑马旅游网黑马旅游网黑马旅游网黑马旅游网黑马旅游网</p>
<p>黑马旅游网黑马旅游网黑马旅游网黑马旅游网黑马旅游网黑马旅游网黑马旅游网黑马旅游网黑马旅游网黑马旅游网黑马旅游网黑马旅游网</p>

<!-- hr 显示一条水平线-->
<hr color="red" width="200" size="10" align="left">

<!-- 加粗 b-->
<b>黑马旅游网</b>
<hr>

<!--斜体 i-->
<i>黑马旅游网</i>
<hr>
<!-- 字体标签 font-->
<font color="black" size="5" face="楷体">黑马旅游网</font>
<hr>

<center><font color="black" size="5" face="楷体">黑马旅游网</font>
</center>
</body>
</html>

图片标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>图片标签</title>
</head>
<body>
<img src="image/banner_1.jpg" align="right" width="1000" alt="图片">
</body>
</html>

列表标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>列表标签</title>
</head>
<body>
<!-- 有序列表 ol-->
<ol type="A" START="2">
    <li>睁眼</li>
    <li>看手机</li>
    <li>穿衣服</li>
    <li>洗漱</li>
</ol>

<!-- 无序列表 ul-->
<ul>
    <li>睁眼</li>
    <li>看手机</li>
    <li>穿衣服</li>
    <li>洗漱</li>
</ul>
</body>
</html>

链接标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>链接标签</title>
</head>
<body>
<!-- 超链接 a-->
<a href="http://www.itcast.cn">点我</a>
<br>

<a href="http://www.itcast.cn" target="_self">点我</a>
<br>

<!-- 换一个界面显示-->
<a href="http://www.itcast.cn" target="_blank">换一个界面显示</a>
<br>

<!--本地链接-->
<a href="./4_图片标签.html">图片标签</a>
<br>

<a href="http://www.itcast.cn"><img src="image/banner_1.jpg">点我</a>

</body>
</html>

块标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>块标签</title>
</head>
<body>
<span>黑马</span>
<span>黑马</span>
<br>

<div>djhksa</div>
<div>djhksa</div>
</body>
</html>

表格标签


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

<table border="1" width="50%" cellpadding="0" cellspacing="0" bgcolor="#faebd7" align="center">
    <tr>
        <!-- <td>编号</td>
         <td>姓名</td>
         <td>成绩</td>-->
        <th>编号</th>
        <th>姓名</th>
        <th>成绩</th>

    </tr>

    <tr>
        <td>1</td>
        <td>小龙女</td>
        <td>100</td>

    </tr>

    <tr>
        <td>2</td>
        <td>杨过</td>
        <td>50</td>

    </tr>

</table>


<hr>


<table border="1" width="50%" cellpadding="0" cellspacing="0" bgcolor="#faebd7" align="center">

    <thead>
    <caption>学生信息表</caption>

    <tr>
        <!-- <td>编号</td>
         <td>姓名</td>
         <td>成绩</td>-->
        <th>编号</th>
        <th>姓名</th>
        <th>成绩</th>

    </tr>
    </thead>



    <tbody>
    <tr bgcolor="#7fffd4" align="center">
        <td>1</td>
        <td>小龙女</td>
        <td>100</td>

    </tr>

    <tr>
        <td>2</td>
        <td>杨过</td>
        <td>50</td>

    </tr>

    </tbody>

    <tfoot>
    <tr>
        <td>3</td>
        <td>尹志平</td>
        <td>10</td>

    </tr>

    </tfoot>


</table>

<hr>

<table border="1" width="50%" cellpadding="0" cellspacing="0" bgcolor="#faebd7" align="center">
    <tr>

        <th rowspan="2">编号</th>
        <th>姓名</th>
        <th>成绩</th>

    </tr>

    <tr>

        <td>小龙女</td>
        <td>100</td>

    </tr>

    <tr>
        <td>2</td>
        <td colspan="2">杨过</td>


    </tr>

</table>


<hr>




</body>
</html>

网站首页


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>黑马旅游网</title>
</head>
<body>

<!--采用table来完成布局-->
<!--最外层的table,用于整个页面的布局-->
<table width="100%" align="center">
    <!-- 第1行 -->
    <tr>
        <td>
            <img src="image/top_banner.jpg" width="100%" alt="">
        </td>
    </tr>

    <!-- 第2行 -->
    <tr>
        <td>
            <table width="100%" align="center">
                <tr>
                    <td>
                        <img src="image/logo.jpg" alt="">
                    </td>
                    <td>
                        <img src="image/search.png" alt="">
                    </td>
                    <td>
                        <img src="image/hotel_tel.png" alt="">
                    </td>
                </tr>
            </table>

        </td>
    </tr>

    <!-- 第3行 -->
    <tr>
        <td>
            <table width="100%" align="center">
                <tr bgcolor="#ffd700" align="center" height="45" >
                    <td>
                        <a href="">首页</a>
                    </td>

                    <td>
                        门票
                    </td>

                    <td>
                        门票
                    </td>

                    <td>
                        门票
                    </td>

                    <td>
                        门票
                    </td>

                    <td>
                        门票
                    </td>

                    <td>
                        门票
                    </td>

                    <td>
                        门票
                    </td>

                    <td>
                        门票
                    </td>

                    <td>
                        门票
                    </td>
                </tr>
            </table>
        </td>
    </tr>

    <!-- 第4行 轮播图 -->
    <tr>
        <td>
            <img src="image/banner_3.jpg" alt="" width="100%">
        </td>
    </tr>

    <!-- 第5行 黑马精选-->
    <tr>
        <td>
            <img src="image/icon_5.jpg" alt="">
            黑马精选
            <hr  color="#ffd700" >
        </td>
    </tr>

    <!-- 第6行 -->
    <tr>
        <td>
            <table align="center" width="95%">
                <tr>
                    <td>

                        <img src="image/jiangxuan_1.jpg" alt="">
                        <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                        <font color="red">&yen; 899</font>
                    </td>

                    <td>

                        <img src="image/jiangxuan_1.jpg" alt="">
                        <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                        <font color="red">&yen; 899</font>
                    </td>

                    <td>

                        <img src="image/jiangxuan_1.jpg" alt="">
                        <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                        <font color="red">&yen; 899</font>
                    </td>

                    <td>

                        <img src="image/jiangxuan_1.jpg" alt="">
                        <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                        <font color="red">&yen; 899</font>
                    </td>
                </tr>
            </table>
        </td>
    </tr>

    <!-- 第7行 国内游 -->
    <tr>
        <td>
            <img src="image/icon_6.jpg" alt="">
            国内游
            <hr  color="#ffd700" >
        </td>
    </tr>

    <!-- 第8行 -->
    <tr>
        <td>
            <table align="center" width="95%">
                <tr>
                    <td rowspan="2">
                        <img src="image/guonei_1.jpg" alt="">
                    </td>

                    <td>

                        <img src="image/jiangxuan_2.jpg" alt="" height="100%">
                        <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                        <font color="red">&yen; 699</font>
                    </td>

                    <td>

                        <img src="image/jiangxuan_2.jpg" alt="">
                        <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                        <font color="red">&yen; 699</font>
                    </td>

                    <td>

                        <img src="image/jiangxuan_2.jpg" alt="">
                        <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                        <font color="red">&yen; 699</font>
                    </td>
                </tr>

                <tr>
                    <td>

                        <img src="image/jiangxuan_2.jpg" alt="">
                        <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                        <font color="red">&yen; 699</font>
                    </td>

                    <td>

                        <img src="image/jiangxuan_2.jpg" alt="">
                        <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                        <font color="red">&yen; 699</font>
                    </td>

                    <td>

                        <img src="image/jiangxuan_2.jpg" alt="">
                        <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                        <font color="red">&yen; 699</font>
                    </td>


                </tr>
            </table>
        </td>
    </tr>

    <!-- 第9行 境外游 -->
    <tr>
        <td>
            <img src="image/icon_7.jpg" alt="">
            境外游
            <hr  color="#ffd700" >
        </td>
    </tr>

    <!-- 第10行 -->
    <tr>
        <td>
            <table align="center" width="95%">
                <tr>
                    <td rowspan="2">
                        <img src="image/jiangwai_1.jpg" alt="">
                    </td>

                    <td>

                        <img src="image/jiangxuan_3.jpg" alt="" height="100%">
                        <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                        <font color="red">&yen; 699</font>
                    </td>

                    <td>

                        <img src="image/jiangxuan_3.jpg" alt="">
                        <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                        <font color="red">&yen; 699</font>
                    </td>

                    <td>

                        <img src="image/jiangxuan_3.jpg" alt="">
                        <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                        <font color="red">&yen; 699</font>
                    </td>
                </tr>

                <tr>
                    <td>

                        <img src="image/jiangxuan_3.jpg" alt="">
                        <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                        <font color="red">&yen; 699</font>
                    </td>

                    <td>

                        <img src="image/jiangxuan_3.jpg" alt="">
                        <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                        <font color="red">&yen; 699</font>
                    </td>

                    <td>

                        <img src="image/jiangxuan_3.jpg" alt="">
                        <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                        <font color="red">&yen; 699</font>
                    </td>


                </tr>
            </table>
        </td>
    </tr>
    <!-- 第11行 -->
    <tr>
        <td>
            <img src="image/footer_service.png" alt="" width="100%">
        </td>
    </tr>

    <!-- 第12行 -->
    <tr>
        <td align="center" bgcolor="#ffd700" height="40">
            <font color="gray" size="2">
                江苏传智播客教育科技股份有限公司
                版权所有Copyright 2006-2018&copy;, All Rights Reserved 苏ICP备16007882
            </font>
        </td>
    </tr>

</table>


</body>
</html>

表单标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单标签</title>
</head>
<body>
    <!--
        form:用于定义表单
            属性:
                action:指定提交数据的URL
                method:提交方式
                    get:
                        1.请求参数会在地址栏中显示
                        2.请求参数大小有限制
                        3.不安全
                    post:
                        1.请求参数不会在地址栏中显示
                        2.请求参数大小没有限制
                        3.较为安全
    -->

<form action="#" method="post">
    用户名:<input name="username"><br>
    密码:<input name="password"><br>
    <input type="submit" value="登陆">
</form>

</body>
</html>

表单项标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单标签</title>
</head>
<body>
    <!--
        form:用于定义表单
            属性:
                action:指定提交数据的URL
                method:提交方式
                    get:
                        1.请求参数会在地址栏中显示
                        2.请求参数大小有限制
                        3.不安全
                    post:
                        1.请求参数不会在地址栏中显示
                        2.请求参数大小没有限制
                        3.较为安全

         表单项标签:
            input:可以通过type属性值,改变元素展示的样式
                type属性:
                    text:文本输入框,默认值
                    password:密码输入框
                    radio:单选框
                        1.想让多个单选框实现单选的效果,则多个单选框的name属性值必须一样
                        2.一般会给每一个单选框提供value属性,指定其被选中后提交的值
                        3.checked属性,可以指定默认值
                    checkedbox:复选框
                        1.一般会给每一个单选框提供一个value值,指定其被选中后提交的值
                        2.checked属性,可以指定默认值
            label:指定输入项的文字描述信息
                    1.label的for属性一般会和input的id属性值对应,点击label会聚焦
    -->

<form action="#" method="get">
    <label for="username">用户名</label>:<input name="username" placeholder="请输入用户名" id="username"><br>
    <label for="password">密码</label>:<input name="password" placeholder="请输入密码" id="password"><br>
    性别: <input type="radio" name="gender" value="male" checked>男
          <input type="radio" name="gender" value="female">女
    <br>
    爱好: <input type="checkbox" name="hobby" value="shopping">购物
          <input type="checkbox" name="hobby" value="java" checked>java
          <input type="checkbox" name="hobby" value="game">游戏
    <br>

    图片: <input type="image" name="file"><br>
    隐藏阈: <input type="hidden" name="id" value="aaa"><br>
    取色器: <input type="color" name="color"><br>
    生日: <input type="date" name="birthday"><br>
    生日: <input type="datetime-local" name="birthday"><br>
    邮箱: <input type="email" name="email"><br>
    年龄: <input type="number" name="age"><br>

    省份: <select name="province">
                <option value="">---请选择---</option>
                <option value="1">北京</option>
                <option value="2">上海</option>
                <option value="3">杭州</option>

           </select><br>

    自我描述:
           <textarea cols="20" rows="5"></textarea><br>
    <input type="button" value="按钮"><br>
    <input type="image" src="img/regbtn.jpg"><br>
    <input type="submit" value="登陆">
</form>

</body>
</html>

注册页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册页面</title>
</head>
<body>
<form action="#" method="post">
    <table border="1" align="center" width="500">
        <tr>
            <td>
                <label for="username">用户名</label>
            </td>
            <td>
                <input type="text " name="username" id="username">
            </td>
        </tr>
        <tr>
            <td>
                <label for="password">密码</label>
            </td>
            <td>
                <input type="password " name="password" id="password">
            </td>
        </tr>
        <tr>
            <td>
                <label for="Email">Email</label>
            </td>
            <td>
                <input type="email " name="Email" id="Email">
            </td>
        </tr>
        <tr>
            <td>
                <label for="name">姓名</label>
            </td>
            <td>
                <input type="text " name="name" id="name">
            </td>
        </tr>
        <tr>
            <td>
                <label for="tel">手机号</label>
            </td>
            <td>
                <input type="text " name="tel" id="tel">
            </td>
        </tr>
        <tr>
            <td>
                <label >性别</label>
            </td>
            <td>
                <input type="radio" name="gender"  value="male">男
                <input type="radio" name="gender" value="female">女
            </td>
        </tr>

        <tr>
            <td>
                <label for="birthday">出生日期</label>
            </td>
            <td>
                <input type="date" name="birthday" id="birthday">
            </td>
        </tr>
        <tr>
            <td>
                <label for="checkcode">验证码</label>
            </td>
            <td>
                <input type="text" name="checkcode" id="checkcode">
            </td>
            <td>
                <input type=image src="img/verify_code.jpg">
            </td>
        </tr>
        <tr>
            <td colspan="2" align="center">
                <input type="submit" value="注册">
            </td>
        </tr>


    </table>
</form>
</body>
</html>

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
SQLAlchemy 是一个 SQL 工具包和对象关系映射(ORM)库,用于 Python 编程语言。它提供了一个高级的 SQL 工具和对象关系映射工具,允许开发者以 Python 类和对象的形式操作数据库,而无需编写大量的 SQL 语句。SQLAlchemy 建立在 DBAPI 之上,支持多种数据库后端,如 SQLite, MySQL, PostgreSQL 等。 SQLAlchemy 的核心功能: 对象关系映射(ORM): SQLAlchemy 允许开发者使用 Python 类来表示数据库表,使用类的实例表示表中的行。 开发者可以定义类之间的关系(如一对多、多对多),SQLAlchemy 会自动处理这些关系在数据库中的映射。 通过 ORM,开发者可以像操作 Python 对象一样操作数据库,这大大简化了数据库操作的复杂性。 表达式语言: SQLAlchemy 提供了一个丰富的 SQL 表达式语言,允许开发者以 Python 表达式的方式编写复杂的 SQL 查询。 表达式语言提供了对 SQL 语句的灵活控制,同时保持了代码的可读性和可维护性。 数据库引擎和连接池: SQLAlchemy 支持多种数据库后端,并且为每种后端提供了对应的数据库引擎。 它还提供了连接池管理功能,以优化数据库连接的创建、使用和释放。 会话管理: SQLAlchemy 使用会话(Session)来管理对象的持久化状态。 会话提供了一个工作单元(unit of work)和身份映射(identity map)的概念,使得对象的状态管理和查询更加高效。 事件系统: SQLAlchemy 提供了一个事件系统,允许开发者在 ORM 的各个生命周期阶段插入自定义的钩子函数。 这使得开发者可以在对象加载、修改、删除等操作时执行额外的逻辑。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值