HTML练习题:彼岸的花(web)

展示效果:

代码:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>彼岸の花</title><style type="text/css">*{margin:0;padding:0;}body{background-color: #ededed;font-family: 楷体;font-size:16px;color: #a5a5a5;   /* 字体的颜色*/}.header{width:980px;margin:0 auto 7px;  /* 上外边距是0,水平居中,下划线距离正文是7px*/height:86px;  /*  盒子的高度*/line-height: 86px;   /* 文本的高度*/text-align: center;font-family: 微软雅黑;color: #a5a5a5;}/* .header h1{/* font-weight:normal; } */.header strong{font-weight:normal;font-size:30px;}.header em{font-weight: normal;font-style:normal;  /*格式恢复正常,不是斜体,添加它是为了方便调节大小的*/ font-size:14px;}.fenlei{width:980px;margin:0 auto;}.fenlei h2{font-size:14px;font-family: 微软雅黑;color: #a5a5a5;height:42px;line-height: 42px;}.fenlei p{font-size:30px;text-align:center;font-size:18px;}.bestseller{width:602px;margin:0 auto;}.bestseller .txt{line-height: 30px;text-indent: 2em;   /*首行缩进*/}.bestseller .txt em{font-style:normal;text-decoration: underline;}.shouhou{width:602px;margin:0 auto;font-family: 微软雅黑;text-align: center;font-size:16px;font-weight: bold;  /*加粗*/}.boss{width:602px;margin:0 auto;}.boss h3{height: 30px;line-height: 30px;font-family: 微软雅黑;font-size: 18px;font-weight: normal;text-indent: 2em;}.boss p{text-indent: 2em;font-style: italic;line-height: 26px;font-size:14px;}</style>
</head>
<body>
<!--标题模块-->
<div class="header"><h1><strong>彼岸の花</strong>&nbsp;&nbsp;<em>偏安一隅,静静生活</em></h1><hr size="2" color="#d1d1d1" width="980px">
</div>
<!--分类模块-->
<div class="fenlei"><h2>商品分类 ></h2><img src="banner.jpg" alt="网上花店"><br/> <br/>   <!--换行--><p>我喜欢一些花儿,静静地开放,从不声张。小小的花朵,有着异样的芬芳...</p> <br><p>I love flowers, quietly open, never quiet. Little flowers, with the same fragrance...</p><br />
</div>
<!--热卖模块-->
<div class="bestseller"><img src="bestseller1.png" alt=""><br> <br><img src="bestseller2.jpg" alt=""><br><br><p class="txt">多肉植物是指植物营养器官肥大的高等植物,<em>通常具根、茎、叶三种营养器官和花、果实、种子三种繁殖器官</em>。在园艺上,又称肉质植物或多肉花卉,但以多肉植物这个名称最为常用。</p><p class="txt"><em>全世界共有多肉植物一万余种</em>,它们绝大部分属于高等植物(绝大多数是被子植物)。植物上隶属几十个科,个别专家认为有67个科中含有多肉植物,但大多数专家认为只有50余科。</p><br>
</div>
<!--页脚模块-->
<div class="shouhou">品质保障&nbsp;&nbsp;|&nbsp;&nbsp;七天无理由退换货&nbsp;&nbsp;|&nbsp;&nbsp;特色服务体验&nbsp;&nbsp;|&nbsp;&nbsp;帮助中心<br> <br>
</div>
<div class="boss"><img src="tuxiang.gif" alt="网上花店" align="left"><h3>店主: Michael_唐僧</h3><p>飞舞的花儿像一首诗 ?写着秋天的心事 ?带着相思 ?轻轻、轻轻 ?飘向大地 ?</p><p>也许这只是秋季里的一场游戏 ?</p><br><br><br>
</div>
</body>
</html>

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

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

学STM32选标准库还是HAL库?

我学STM32的时候&#xff0c;stm32cubeMX还没推出&#xff0c;HAL库还没出来&#xff0c;主要以标准库为准。 下面讲下我学习STM32的经历&#xff0c;从陌生到应用到项目大概花了2-3周&#xff0c;相信99%的人都能通过这种方法&#xff0c;快速把STM32玩起来。 我是项目需要&am…

池化层笔记

池化层 文章目录 池化层二维池化层超参数池化层的分类代码实现填充和步幅 多个通道 总结 卷积对位置敏感&#xff0c;可以检测垂直边缘。需要有一定程度的平移不变性&#xff0c;而在平时图片的拍摄&#xff0c;会因为图片的照明&#xff0c;物体位置&#xff0c;比例&#xff…

以太网交换安全:DHCP Snooping

一、DHCP Snooping的概念及功能 DHCP Snooping是一种用于增强网络中DHCP服务安全性的技术。以下是对以太网交换安全中的DHCP Snooping进行详细的介绍&#xff1a; 基本概述 定义目的&#xff1a;DHCP Snooping是一种网络安全技术&#xff0c;旨在防止未经授权的DHCP服务器在网…

【问题记录】解决VMware虚拟机中鼠标侧键无法使用的问题

前言 有项目需要在Linux系统中开发&#xff0c;因为要测试Linux中相关功能&#xff0c;要用到shell&#xff0c;在Windows中开发太麻烦了&#xff0c;因此我选择使用UbuntuXfce4桌面来开发&#xff0c;这里我用到了Linux版本的IDEA&#xff0c;除了快捷键经常和系统快捷键冲突…

[JAVAEE] 面试题(二) - CAS 和 原子类

目录 一. CAS的实现原理 1.1 伪代码分析 1.2 底层实现 二. CAS 操作示例 三. ABA问题 四. 原子类 4.1 使用原子类的目的 4.2 原子类的使用示例 五. 总结 一. CAS的实现原理 CAS(compare and swap 比较和交换)是一种用于实现无锁并发的技术. 1.1 伪代码分析 // 伪代…

Ubuntu 20.04 安装 OpenCV 和 OpenCV_contrib 教程

Ubuntu 20.04 安装 OpenCV 和 OpenCV_contrib 教程 Ubuntu 20.04 安装 OpenCV 和 OpenCV_contrib 教程前言 OpenCV概述核心功能优势特点应用领域安装与使用 OpenCV_contrib概述核心功能具体模块 安装与使用一、准备工作二、下载OpenCV和OpenCV_contrib三、编译和安装OpenCV四、…

HCIP--2 TCP有关笔记

学习目标&#xff1a; 目录 学习目标&#xff1a; 学习内容&#xff1a; TCP协议 七层结构 END.......... 问题&#xff1a;TCP/IP 的四层协议 问题&#xff1a;网络的七层结构及其作用 问题&#xff1a;协议名称是什么&#xff1f; TELNET---远程登陆系统 HTTP---超文本传输协…

【优先算法】双指针

✨✨欢迎大家来到Celia的博客✨✨ &#x1f389;&#x1f389;创作不易&#xff0c;请点赞关注&#xff0c;多多支持哦&#x1f389;&#x1f389; 所属专栏&#xff1a;优先算法 个人主页&#xff1a;Celias blog~ 目录 ​​​​​​移动零 复写零 快乐数 盛水最多的容器 …

Apache配置案例二:基于域名的虚拟主机搭建

文章目录 前言一、任务要求&#xff1a;二、任务分析&#xff1a;二、任务步骤&#xff1a;总结 前言 基于域名的虚拟主机搭建&#xff0c;涉及诸多知识点&#xff0c;一是域名服务器的搭建配置&#xff0c;前面的博文《图示详解OpenEuler下 DNS安装、配置与测试》、《图示详解…

如何选择适合自己的 Python IDE

集成开发环境&#xff08;IDE&#xff09;是指提供广泛软件开发能力的软件应用程序。IDE 通常包括源代码编辑器、构建自动化工具和调试器。大多数现代 IDE 都配备了智能代码补全功能。在本文中&#xff0c;你将发现目前市场上最好的 Python IDE。 什么是 IDE&#xff1f; IDE…

开源项目-投票管理系统

哈喽&#xff0c;大家好&#xff0c;今天主要给大家带来一个开源项目-投票管理系统 投票管理系统主要有首页&#xff0c;发起投票&#xff0c;管理投票&#xff0c;参与投票&#xff0c;查看投票等功能 首页 为用户提供了一键导航到各个功能模块的便捷途径。 新增投票 用户…

OpenSSL

OpenSSL 概述 OpenSSL 是一个开源的、安全传输协议实现工具&#xff0c;广泛应用于数据加密与解密、证书生成与管理以及其他安全性相关的任务。在现代网络安全中&#xff0c;OpenSSL 被用于构建和维护 SSL/TLS 通信&#xff0c;确保数据在传输过程中的机密性和完整性。 简单来…

ApsaraMQ Serverless 能力再升级,事件驱动架构赋能 AI 应用

本文整理于 2024 年云栖大会阿里云智能集团高级技术专家金吉祥&#xff08;牟羽&#xff09;带来的主题演讲《ApsaraMQ Serverless 能力再升级&#xff0c;事件驱动架构赋能 AI 应用》 云消息队列 ApsaraMQ 全系列产品 Serverless 化&#xff0c;支持按量付费、自适应弹性、跨可…

fmql之Linux以太网

正点原子第57章。 dts fmql-dtsi&#xff1a; 我们用的PHY芯片是RTL8211F&#xff1a; 需要添加PHY信息&#xff1a; fmql-dtsi提供的参考&#xff1a; 根据vivado工程自动生成的&#xff1a; reg <0x1>; 配置 疑问 网口通讯需要网线&#xff0c;但是目前板卡上只有PS…

Java面试经典 150 题.P26. 删除有序数组中的重复项(003)

本题来自&#xff1a;力扣-面试经典 150 题 面试经典 150 题 - 学习计划 - 力扣&#xff08;LeetCode&#xff09;全球极客挚爱的技术成长平台https://leetcode.cn/studyplan/top-interview-150/ 题解&#xff1a; class Solution {public int removeDuplicates(int[] nums) …

在 Elasticsearch 中顺利管理季节性时间变化

作者&#xff1a;来自 Elastic Valeriy Khakhutskyy, James Gowdy 用于 Elasticsearch 异常检测的新夏令时日历。 每年春季和秋季两次&#xff0c;许多国家/地区都会调整时钟以更好地利用日光。这些时钟调整不仅会带来时差和 “困倦的星期一” 的感觉&#xff0c;还会带来来自…

Qt——信号和槽

一.信号和槽概述 谈及信号&#xff0c;很容易联想到在Linux系统中所分享到的信号。那么Linux信号和Qt信息有什么不同&#xff1f; 在 Qt 中&#xff0c;用户和控件的每次交互过程称为⼀个事件。比如 "用户点击按钮" 是⼀个事件&#xff0c;"用户关 闭窗口&quo…

必胜客万圣节“邪恶鬼手披萨”,品牌营销的“鬼”才之作!

在万圣节的神秘氛围下&#xff0c;各大品牌纷纷推出创意营销活动&#xff0c;试图在这个充满奇幻色彩的节日里捕获消费者的心。其中&#xff0c;必胜客推出的“邪恶鬼手披萨”无疑是一次令人拍案叫绝的品牌营销“鬼”才之作&#xff0c;它不仅巧妙地融合了节日元素&#xff0c;…

3D Gaussian Splatting代码详解(一):模型训练、数据加载

1 模型训练 def training(dataset, opt, pipe, testing_iterations, saving_iterations, checkpoint_iterations, checkpoint, debug_from):first_iter 0# 初始化高斯模型&#xff0c;用于表示场景中的每个点的3D高斯分布gaussians GaussianModel(dataset.sh_degree)# 初始化…

[MySQL#6] 表的CRUD (1) | Create | Retrieve(查) | where

目录 1. 插入 1.1 单行数据 - 全列插入 指定列插入 1.2 多行数据 - 全列插入 指定列插入 1.3 更新 1.4 替换 2. 查找 2.1 select 列 2.2 where 条件 具体案例 2.3 结果排序 总结关键字执行顺序 2.4 筛选分页结果 CRUD : Create(创建)&#xff0c;Retrieve(读取)&…