HTML实现页面

html 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>工商银行电子汇款单</title>
</head>
<body>
    <h1>工商银行电子汇款单</h1>
    <table border="1" cellpadding="0" cellspacing="0">
        <tr>
        	<td colspan="2" width="95"><b>回单类型</b></td>
            <td width="400">网上转账汇款</td>
            <td colspan="2" width="95"><b>指令序号</b></td>
            <td width="400">HQH00000000000013878172</td>
        </tr>
        <tr>
            <td rowspan="4" width="10"><b>收款人</b></td>
            <td>户名</td>
            <td>老牟</td>
            <td rowspan="4" width="10"><b>付款人</b></td>
            <td>户名</td>
            <td>老刘</td>
        </tr>
        <tr>
            <td><b>卡号</b></td>
            <td>00000000001</td>
            <td><b>卡号</b></td>
            <td>000000000002</td>
        </tr>
        <tr>
            <td>地区</td>
            <td>南京</td>
            <td>地区</td>
            <td>杭州</td>
        </tr>
        <tr>
            <td><b>网点</b></td>
            <td>工商江苏南京业务处理中心</td>
            <td><b>网点</b></td>
            <td>江苏徐州业务中心</td>
        </tr>
        <tr>
            <td colspan="2"><b>币种</b></td>
            <td>人民币</td>
            <td colspan="2"><b>钞汇标志</b></td>
            <td>钞票</td>
        </tr>
        <tr>
            <td colspan="2"><b>金额</b></td>
            <td>1.00元</td>
            <td colspan="2"><b>手续费</b></td>
            <td>0.57元</td>
        </tr>
        <tr>
            <td colspan="2"><b>合计</b></td>
            <td colspan="4">人民币(大写):壹元整</td>
        </tr>
        <tr>
            <td colspan="2"><b>交易时间</b></td>
            <td><em>2017年6月1日</em></td>
            <td colspan="2"><b>时间戳</b></td>
            <td><em>2017-06-01-13.00.00.00000</em></td>
        </tr>
    </table>
    <p>票据打印时间:2017-06-01 15:00:12</p>
    <p><del>票据打印单位:江苏徐州业务中心</del></p>
    <p>操作员:大曾</p>
</body>
</html>

实现页面

html 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>李白诗词</title>
</head>
<body>
    <h1>将进酒 <small>君不见黄河之水天上来</small></h1>
    <table>
        <tr>
            <td rowspan="13"><img src="img/李白.jpg" width="300" height="600"></td>
            <td>君不见黄河之水天上来,奔流到海不复回。</td>
        </tr>
        <tr>
            <td>君不见高堂明镜生白发,朝如青丝暮成雪</td>
        </tr>
        <tr>
            <td>人生得意须尽欢,莫使金樽空对月</td>
        </tr>
        <tr>
            <td>天生我材必有用,千金散尽还复来。</td>
        </tr>
        <tr>
            <td>烹羊宰牛且为乐,会须一饮三百杯。</td>
        </tr>
        <tr>
            <td>岑夫子,丹丘生,将进酒,杯莫停。</td>
        </tr>
        <tr>
            <td>与君歌一曲,请君为我侧耳听。</td>
        </tr>
        <tr>
            <td>钟鼓馔玉不足贵,但愿长醉不复醒。</td>
        </tr>
        <tr>
            <td>古来圣贤皆寂寞,惟有饮者留其名。</td>
        </tr>
        <tr>
            <td>陈王昔时宴平乐,斗酒十千恣欢谑。</td>
        </tr>
        <tr>
            <td>主人何为言少钱,径须沽取对君酌。</td>
        </tr>
        <tr>
            <td>五花马,千金裘,</td>
        </tr>
        <tr>
            <td>呼儿将出换美酒,与尔同销万古愁。</td>
        </tr>
    </table>
</body>
</html>
html 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>豆瓣电影</title>
</head>
<body>
    <h2>热门电影板块</h2>
    <hr>
    <table width="800">
        <tr>
            <td><b>最近热门电影</b></td>
            <td>热门</td>
            <td>最新</td>
            <td>豆瓣高分</td>
            <td>冷门佳片</td>
            <td>华语</td>
            <td>欧美</td>
            <td>韩国</td>
            <td >日本</td>
            <td width="100"></td>
            <td>更多>></td>
        </tr>
    </table>
    <hr>
    <table width="800">
        <tr>
            <td><img src="img/movie1.jpg" width="180"></td>
            <td><img src="img/movie2.jpg" width="180"></td>
            <td><img src="img/movie3.jpg" width="180"></td>
            <td><img src="img/movie4.jpg" width="180"></td>
        </tr>
        <tr>
            <td>猜火车 8.1</td>
            <td>贝尔科实验 6.0</td>
            <td>加州公路巡警 6.8</td>
            <td>歌声不绝 6.3</td>
        </tr>
        <tr>
            <td><img src="img/movie5.jpg" width="180"></td>
            <td><img src="img/movie6.jpg" width="180"></td>
            <td><img src="img/movie7.jpg" width="180"></td>
            <td><img src="img/movie8.jpg" width="180"></td>
        </tr>
        <tr>
            <td>明日的我与昨日的我</td>
            <td>速度与激情8</td>
            <td>极速特工</td>
            <td>金刚狼3:殊死一战</td>
        </tr>
    </table>
</body>
</html> 
相关推荐
桂月二二4 小时前
探索前端开发中的 Web Vitals —— 提升用户体验的关键技术
前端·ux
hunter2062065 小时前
ubuntu向一个pc主机通过web发送数据,pc端通过工具直接查看收到的数据
linux·前端·ubuntu
qzhqbb5 小时前
web服务器 网站部署的架构
服务器·前端·架构
刻刻帝的海角5 小时前
CSS 颜色
前端·css
九酒6 小时前
从UI稿到代码优化,看Trae AI 编辑器如何帮助开发者提效
前端·trae
浪浪山小白兔7 小时前
HTML5 新表单属性详解
前端·html·html5
lee5767 小时前
npm run dev 时直接打开Chrome浏览器
前端·chrome·npm
2401_897579657 小时前
AI赋能Flutter开发:ScriptEcho助你高效构建跨端应用
前端·人工智能·flutter
limit for me8 小时前
react上增加错误边界 当存在错误时 不会显示白屏
前端·react.js·前端框架
浏览器爱好者8 小时前
如何构建一个简单的React应用?
前端·react.js·前端框架