HTML基础入门——简单网页页面

目录

一，网上转账电子账单

​编辑

1，所利用到的标签

2，代码编写

3，运行结果

二，李白诗词

1，所用到的标签

2，照片的编辑

3，代码编写

4，运行结果

一，网上转账电子账单

1，所利用到的标签

  1. P   段落标签，一段是一个内容，段落之间存在间隔
  2. hn (1-6) 标题标签
  3. br   换行
  4. 文本修饰标签（加粗，加斜，加下划线，中划线等等效果）
  5. 加粗：strong / b
  6. 中划线：del

2，代码编写

<!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="5" cellspacing="0" width="1000">

    <tr>

        <td colspan="2"><b>回单类型</b></td>

        <td>网上转账汇款</td>

        <td colspan="2"><b>指令序号</b></td>

        <td>HQH000000000000013878172</td>

    </tr>

   <tr>

        <td rowspan="4" width="10" ><b>收款人</b></td>

        <td width="50">户名</td>

        <td>老牟</td>

        <td rowspan="4" width="10" ><b>付款人</b></td>

        <td width="50">户名</td>

        <td>老刘</td>

   </tr>

   <tr>

    <td><b>卡号</b></td>

    <td>0000000000001</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>人民币（大写）：壹元整</td>

   </tr>

   <tr>

    <td colspan="2"><b>交易时间</b></td>

    <td>2017年6月1日</td>

    <td colspan="2"><b>时间截止</b></td>

    <td>2017-06-01-13.00.00 00000</td>

   </tr>

<table>

    <p>票据打印时间：2017年-06-01 15：00：12</p>

    <p><del>票据打印单位：江苏徐州业务中心</del></p>

    <p>操作员：大曾</p>

</table>

</body>

</html>

3，运行结果

二，李白诗词

1，所用到的标签

图片标签：展示图片的标签， “ <img> ”标签就是图片标签。

属性：一般以键值对形式在标签的开始部分

注意：我们要想在自己的网页插入照片，首先将照片保存在本地磁盘文件里，再将其拖到vscode的编译器里

2，照片的编辑

3，代码编写

<!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>

            <img src="./照片/jmg/李白.jpg">

        </td>

        <td>

            <p>君不见黄河之水天上来，奔流到海不复回。</p>

            <p>君不见高堂明镜悲白发，朝如青丝暮成雪。</p>

            <p>人生得意须尽欢，莫使金樽空对月。</p>

            <p>天生我材必有用，千金散尽还复来。</p>  

            <p>烹羊宰牛且为乐，会须一饮三百杯。</p>

            <P>岑夫子，丹丘生，将进酒，杯莫停。</P>

            <p>与君歌一曲，请君为我倾耳听。</p>

            <p>钟鼓馔玉不足贵，但愿长醉不复醒。</p>

            <p>古来圣贤皆寂寞，惟有饮者留其名。</p>

            <p>陈王昔时宴平乐，斗酒十千恣欢谑。</p>

            <p>主人何为言少钱，径须沽取对君酌。</p>

            <p>五花马、千金裘，呼儿将出换美酒，与尔同销万古愁。</p>

        </td>

    </tr>

</table>

</body>

</html>

4，运行结果

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：/a/950668.html

如若内容造成侵权/违法违规/事实不符，请联系我们进行投诉反馈qq邮箱809451989@qq.com，一经查实，立即删除！

相关文章

Kubernetes集群架构

Kubernetes集群架构

Kubernetes集群架构 Kubernetes 集群架构控制平面组件kube-apiserveretcdkube-schedulerkube-controller-managercloud-controller-manager 节点组件kubeletkebe-proxy&#xff08;可选&#xff09;容器运行时 插件DNSWeb UI&#xff08;Dashboard&#xff09;容器资源监控集群…
阅读更多...
腾讯云AI代码助手-每日清单助手

腾讯云AI代码助手-每日清单助手

作品简介 每日清单助手是一款可以记录生活的小程序&#xff0c;在人们需要记录时使用&#xff0c;所以根据这个需求来创建的这款应用工具&#xff0c;使用的是腾讯云AI代码助手来生成的所有代码&#xff0c;使用方便&#xff0c;快捷&#xff0c;高效。 技术架构 python语言…
阅读更多...
创建基本的 Electron 应用项目的详细步骤

创建基本的 Electron 应用项目的详细步骤

创建一个基本的 Electron 应用项目的详细步骤。我们将从安装 Node.js 开始&#xff0c;然后创建项目文件夹并初始化 Electron 项目。 1. 安装 Node.js 首先&#xff0c;确保你已经安装了 Node.js 和 npm。你可以在终端中运行以下命令来检查是否已经安装&#xff1a; node -v…
阅读更多...
「scipy、eeg」使用python scipy butter filtfilt 分解EEG数据为5个频带和滤波参数选择

「scipy、eeg」使用python scipy butter filtfilt 分解EEG数据为5个频带和滤波参数选择

使用scipy butter filtfilt 分解EEG数据和滤波参数选择 【目录】 EEG数据频带和滤波参数滤波类型及示例Pyhton 代码实现 一、EEG数据频带和滤波参数 二、滤波类型 低通滤波&#xff08;lowpass)高通滤波&#xff08;highpass&#xff09;带通滤波&#xff08;bandpass&…
阅读更多...
网络传输层TCP协议

网络传输层TCP协议

传输层TCP协议 1. TCP协议介绍 TCP&#xff08;Transmission Control Protocol&#xff0c;传输控制协议&#xff09;是一个要对数据的传输进行详细控制的传输层协议。 TCP 与 UDP 的不同&#xff0c;在于TCP是有连接、可靠、面向字节流的。具体来说&#xff0c;TCP设置了一大…
阅读更多...
深度学习第三弹：python入门与线性表示代码

深度学习第三弹：python入门与线性表示代码

一、python入门 1.熟悉基础数据结构——整型数据&#xff0c;浮点型数据&#xff0c;列表&#xff0c;字典&#xff0c;字符串&#xff1b;了解列表及字典的切片&#xff0c;插入&#xff0c;删除操作。 list1 [1, 2, 3, 4, 5] for each in list1:print(each) print(list1[1…
阅读更多...
【Linux】shell脚本编程

【Linux】shell脚本编程

目录 概念&#xff1a; shell脚本的本质&#xff1a; shell脚本编程&#xff1a; shell变量&#xff1a; 变量的定义格式&#xff1a; 变量的分类 自定义变量&#xff1a; 环境变量&#xff1a; 命令变量与命令行参数&#xff1a; 预定义变量&#xff1a; shell中的…
阅读更多...
Onedrive精神分裂怎么办（有变更却不同步）

Onedrive精神分裂怎么办（有变更却不同步）

Onedrive有时候会分裂&#xff0c;你在本地删除文件&#xff0c;并没有同步到云端&#xff0c;但是本地却显示同步成功。 比如删掉了一个目录&#xff0c;在本地看已经删掉&#xff0c;onedrive显示已同步&#xff0c;但是别的电脑并不会同步到这个删除操作&#xff0c;在网页版…
阅读更多...
CSS——1.优缺点

CSS——1.优缺点

<!DOCTYPE html> <html><head><meta charset"UTF-8"><title></title><link rel"stylesheet" type"text/css" href"1-02.css"/></head><body><!--css&#xff1a;层叠样式表…
阅读更多...
软件23种设计模式完整版[附Java版示例代码]

软件23种设计模式完整版[附Java版示例代码]

一、什么是设计模式 设计模式是在软件设计中反复出现的问题的通用解决方案。它们是经过多次验证和应用的指导原则，旨在帮助软件开发人员解决特定类型的问题，提高代码的可维护性、可扩展性和重用性。 设计模式是一种抽象化的思维方式，可以帮助开发人员更好地组织和设计他们…
阅读更多...
（2023|NIPS，LLaVA-Med，生物医学 VLM，GPT-4 生成自指导指令跟随数据集，数据对齐，指令调优）

（2023|NIPS，LLaVA-Med，生物医学 VLM，GPT-4 生成自指导指令跟随数据集，数据对齐，指令调优）

LLaVA-Med: Training a Large Language-and-Vision Assistant for Biomedicine in One Day 目录 LLaVA-Med: Training a Large Language-and-Vision Assistant for Biomedicine in One Day 0. 摘要 1. 简介 2. 相关工作 3. 生物医学视觉指令数据 4. 将多模态对话模型适配…
阅读更多...
深入理解Mybatis原理》MyBatis的sqlSessi

深入理解Mybatis原理》MyBatis的sqlSessi

sqlSessionFactory 与 SqlSession 正如其名&#xff0c;Sqlsession对应着一次数据库会话。由于数据库会话不是永久的&#xff0c;因此Sqlsession的生命周期也不应该是永久的&#xff0c;相反&#xff0c;在你每次访问数据库时都需要创建它&#xff08;当然并不是说在Sqlsession…
阅读更多...
Numpy数组的属性

Numpy数组的属性

NumPy中最重要的一个特点就是其n维数组对象&#xff0c;即ndarray(别名array)对象&#xff0c;该对象具有矢量算术能力和复杂的广播能力&#xff0c;可以执行一些科学计算。不同于Python内置的数组类型&#xff0c; array对象拥有对高维数组的处理能力&#xff0c;这也是数值计…
阅读更多...
（十）提示词任务分解的策略探讨

（十）提示词任务分解的策略探讨

&#x1f4e2;&#x1f4e2;&#x1f4e2; 大家好&#xff0c;我是云楼Yunlord&#xff0c;CSDN博客之星人工智能领域前三名&#xff0c;多年人工智能学习工作经验&#xff0c;一位兴趣稀奇古怪的【人工智能领域博主】&#xff01;&#xff01;&#xff01;&#x1f61c;&#…
阅读更多...
01 数据分析介绍及工具准备

01 数据分析介绍及工具准备

数据分析介绍及工具准备 一、工具准备二、下载和使用Anaconda三、jupyter notebook常用快捷键 一、工具准备 数据科学库 NumPy&#xff0c;SciPy&#xff0c;Pandas&#xff0c;Scikit-Learn 数据可视化库 Matplotlib&#xff0c;Seaborn 编译器 Jupyter Notebook 数据科…
阅读更多...
excel表格二维X、Y坐标散点图

excel表格二维X、Y坐标散点图

excel中存在两列或两行数据&#xff0c;分别表示x坐标和对应的y坐标&#xff0c;同时选中两列或两行数据&#xff1a; 依次选择菜单&#xff0c;插入&#xff0c;图标&#xff0c;XY散点图 可以看到在表格中生成了以第1列为X轴&#xff0c;第2列为Y轴的二维XY散点图&#xff…
阅读更多...
Cursor无限续杯——解决Too many free trials.

Cursor无限续杯——解决Too many free trials.

前情提要 我们都知道Cursor对新用户是有14天且500条免费限制的。 一般情况下&#xff0c;当14天过期&#xff0c;是可以注销账户再重新注册&#xff0c;这样就可以继续拥有14天的体验时长。 但是&#xff01;&#xff01;如果使用超过500次&#xff0c;Cusor就会把你的电脑I…
阅读更多...
HCIE-day10-ISIS

HCIE-day10-ISIS

ISIS ISIS&#xff08;Intermediate System-to-Intermediate System&#xff09;中间系统到中间系统&#xff0c;属于IGP&#xff08;内部网关协议&#xff09;&#xff1b;是一种链路状态协议&#xff0c;使用最短路径优先SPF算法进行路由计算&#xff0c;与ospf协议有很多相…
阅读更多...
洛谷P1617———数字转英文

洛谷P1617———数字转英文

题目如下 思路&#xff1a;将1~9的英文和20~90的英文用字符串数组存储&#xff0c;把下标看作对应的数字进行输出&#xff0c;遇到0或连续多个0就输出“and”&#xff0c;定义l用来看枚举到哪一位了&#xff0c;如果是单独输入一个“0”&#xff0c;则直接输出zero然后结束。否…
阅读更多...
UnityRenderStreaming使用记录（五）

UnityRenderStreaming使用记录（五）

UnityRenderStreaming不一样的错误&#xff0c;船新的版本 继续docker部署UnityRenderStreamingdockerfile一些命令出现了新的错误先解决一个报错不知道怎么解决&#xff0c;先跑个glxgears测试一下先解决MESA和glx的问题新的log&#xff0c;额新的错误尝试解决libnvidia-encod…
阅读更多...
最新文章

Copyright @ 2022~2023