当前位置: 首页 > news >正文

HTML静态网页成品作业(HTML+CSS)—— 香奈儿香水介绍网页(1个页面)

🎉不定期分享源码,关注不丢失哦

文章目录

  • 一、作品介绍
  • 二、作品演示
  • 三、代码目录
  • 四、网站代码
    • HTML部分代码
  • 五、源码获取


一、作品介绍

🏷️本套采用HTML+CSS,未使用Javacsript代码,共有1个页面

二、作品演示

在这里插入图片描述

三、代码目录

在这里插入图片描述

四、网站代码

HTML部分代码

<div class="header"><div class="logo"><img src="./images/logo.png"></div><div class="header_right"><img src="./images/i1.png"><img src="./images/i2.png"><img src="./images/i3.png"><img src="./images/i4.png"></div></div><div class="nav"><div class="on"><a href="">香水</a></div><div><a href="">彩妆</a></div><div><a href="">护肤品</a></div><div class="red"><a href="">1 de CHANEL</a></div></div><div class="banner"><div class="w"><img src="./images/banner.jpeg"><div class="banner_abs"><div class="banner_abs1">香水</div><div class="banner_abs2">给你奇幻,给你香奈儿</div><a class="banner_abs_btn" href="">探索</a></div></div></div><div class="cats"><div class="w"><div class="cats1"><div class="cats_left"><div class="cats_item"><div class="cats_tit"><span>香奈儿五号香水系列</span><img src="./images/jiantou.png"></div><div class="cats_img"><img src="./images/x1.jpeg"><div class="cats_img_abs"><div class="cats_img_abs2">香奈儿五号香水系列</div><a class="cats_img_abs_btn" href="">探索</a></div></div></div></div><div class="cats_right"><div class="cats_item"><div class="cats_tit"><span>香奈儿嘉柏丽尔香水系列</span><img src="./images/jiantou.png"></div><div class="cats_img"><img src="./images/x2.jpg"><div class="cats_img_abs"><div class="cats_img_abs1">香水</div><div class="cats_img_abs2">香奈儿嘉柏丽尔香水系列</div><a class="cats_img_abs_btn" href="">探索</a></div></div></div><div class="cats_item"><div class="cats_tit"><span>香奈儿蔚蓝男士香水系列</span><img src="./images/jiantou.png"></div><div class="cats_img"><img src="./images/x3.jpg"><div class="cats_img_abs"><div class="cats_img_abs1">香水</div><div class="cats_img_abs2">香奈儿蔚蓝男士香水系列</div><a class="cats_img_abs_btn" href="">探索</a></div></div></div></div></div></div></div>

五、源码获取

🥇 ~ 关注我,点赞博文~ 每天带你涨知识!
🎁1.看到这里了就[点赞+好评+收藏]三连 支持下吧,你的「点赞,好评,收藏」是我创作的动力。
💙2.想要获取本文源码,点击前往吧

相关文章:

HTML静态网页成品作业(HTML+CSS)—— 香奈儿香水介绍网页(1个页面)

&#x1f389;不定期分享源码&#xff0c;关注不丢失哦 文章目录 一、作品介绍二、作品演示三、代码目录四、网站代码HTML部分代码 五、源码获取 一、作品介绍 &#x1f3f7;️本套采用HTMLCSS&#xff0c;未使用Javacsript代码&#xff0c;共有1个页面。 二、作品演示 三、代…...

C++11 lambda表达式和包装器

C11 lambda表达式和包装器 一.lambda表达式1.lambda表达式的引入2.基本语法和使用1.基本语法2.使用1.传值捕捉的错误之处2.传引用捕捉 3.lambda表达式的底层原理4.lambda的特殊之处5.lambda配合decltype的新玩法 二.function包装器1.概念2.包装函数1.包装普通函数2.包装成员函数…...

3. MySQL 数据表的基本操作

文章目录 【 1. MySQL 创建数据表 】【 2. MySQL 查看表 】2.1 查看表的属性DESCRIBE/DESC 以表格的形式展示表属性SHOW CREATE TABLE 以SQL语句的形式展示表属性 2.2 查看表的内容 【 3. MySQL 修改数据表结构 】3.1 修改表名3.2 修改表字符集3.3 添加字段在末尾添加字段在开头…...

Linux命令篇(一):文件管理部分

&#x1f49d;&#x1f49d;&#x1f49d;首先&#xff0c;欢迎各位来到我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里不仅可以有所收获&#xff0c;同时也能感受到一份轻松欢乐的氛围&#xff0c;祝你生活愉快&#xff01; 文章目录 1、cat命令常用参…...

IP协议1.0

基本概念&#xff1a; • 主机: 配有IP地址, 但是不进⾏路由控制的设备; • 路由器: 即配有IP地址, ⼜能进⾏路由控制; • 节点: 主机和路由器的统称; IP协议的报头 • 4位版本号(version): 指定IP协议的版本, 对于IPv4来说, 就是4. • 4位头部⻓度(header length): IP头部的⻓…...

源码编译安装LNMP

LNMP包含&#xff1a; linux、Nginx、Mysql、php LNMP的工作原理 &#xff1a; 由客户端发送页面请求给Nginx&#xff0c;Nginx会根据location匹配用户访问请求的URL路径判断是静态还是动态&#xff0c;静态的一般是以 .html .htm .css .shtml结尾&#xff0c;动态的一般是以 .…...

安装Chrome扩展程序来 一键禁用页面上的所有动画和过渡。有那些扩展程序推荐一下

要安装Chrome扩展程序来一键禁用页面上的所有动画和过渡&#xff0c;以下是一些推荐的扩展程序&#xff1a; Toggle CSS Animations and Transitions 功能&#xff1a;此扩展程序允许用户轻松地在网页上切换CSS动画和过渡的开启与关闭状态。使用方法&#xff1a;安装后&#x…...

读人工智能时代与人类未来笔记19_读后总结与感想兼导读

1. 基本信息 人工智能时代与人类未来 (美)亨利基辛格,(美)埃里克施密特,(美)丹尼尔胡滕洛赫尔 著 中信出版社,2023年6月出版 1.1. 读薄率 书籍总字数145千字&#xff0c;笔记总字数39934字。 读薄率39934145000≈27.5% 1.2. 读厚方向 千脑智能 脑机穿越 未来呼啸而来 …...

个人影响力

华人出了个黄仁勋&#xff0c;世界级影响力&#xff0c;还是近代华人历史首次出现具有如此影响力的人。凭借的逻辑是什呢&#xff1f;在人工智能领域有巨大影响力。...

OBS实现多路并发推流

OBS实现多路并发推流 解决方案速览相关依赖下载安装多路推流 解决方案速览 利用OBS进行本地直播画面的构建。 使用Multiple RTMP outputs plugin进行多路并发推流。 相关依赖下载安装 OBS软件 # OBS官网 https://obsproject.com/zh-cnMultiple RTMP outputs plugin # 插件官网…...

JDK环境配置、安装

DK环境配置&#xff08;备注&#xff1a;分32位与64位JDK&#xff0c;32位电脑只能按照32位JDK&#xff0c;64位电脑兼容32、64位JDK&#xff09; 一、检查自己电脑是否安装过JDK 1.在电脑屏幕左下角&#xff0c;输入命令提示符CMD&#xff0c;打开命令提示符应用 2.在打开界…...

莱富康压缩机的选型软件介绍

下载地址 https://download.csdn.net/download/jintaihu/16295771 安装步骤 这里可以选制冷系统的参数&#xff0c;最后在压缩机列表内选择推荐的型号。...

Pr 2024下载安装,Adobe Premiere专业视频编辑软件安装包获取!

Premiere Pro&#xff0c;简称PR&#xff0c;无论是想要剪辑家庭录像&#xff0c;还是制作专业的影视作品&#xff0c;Premiere Pro都能为您提供强大的支持。 Premiere Pro以其卓越的编辑功能和强大的性能&#xff0c;助力用户在视频创作的道路上不断突破自我。 它具备丰富的视…...

MySQL事务与MVCC

文章目录 事务和事务的隔离级别1.为什么需要事务2.事务特性1_原子性&#xff08;atomicity&#xff09;2_一致性&#xff08;consistency&#xff09;3_持久性&#xff08;durability&#xff09;4_隔离性&#xff08;isolation&#xff09; 3.事务并发引发的问题1_脏读2_不可重…...

【数据结构】链式二叉树详解

个人主页~ 链式二叉树基本内容~ 链式二叉树详解 1、通过前序遍历的数组来构建二叉树2、二叉树的销毁3、二叉树节点个数4、二叉树叶子节点个数5、二叉树第k层节点个数6、二叉树查找7、前序遍历8、中序遍历9、后序遍历10、层序遍历与检查二叉树是否为完全二叉树Queue.hQueue.c层序…...

PHP面向对象编程总结

PHP面向对象编程总结 学习PHP时&#xff0c;面向对象编程&#xff08;OOP&#xff09;往往是一个重要的里程碑。PHP的OOP功能提供了一种更加模块化、可扩展和易于维护的代码结构。在本文中&#xff0c;我们将深入探讨PHP面向对象编程的各个方面&#xff0c;包括类与对象、访问控…...

linux中的“->“符号

问&#xff1a; "->“符号在Linux中是什么意思。 例如&#xff1a;当我在一个特定的文件夹中执行ls -l时&#xff0c;我得到了以下结果。 lrwxrwxrwx 1 root root 11 May 16 13:30 nexus3 -> /nexus-data lrwxrwxrwx 1 root root 29 Feb 27 12:23 ojdbc.jar -&g…...

MySql 数据类型选择与优化

选择优化的数据类型 更小的通常更好 一般情况下尽量使用可以正确存储数据的最小类型。更小的数据类型通常更快&#xff0c;因为它们占用更少的磁盘&#xff0c;内存和CPU缓存&#xff0c;并且处理时需要的CPU周期也更少。但也要确保没有低估需要存储值的范围。 简单就好 简单的…...

HTML静态网页成品作业(HTML+CSS)——家乡常德介绍网页(1个页面)

&#x1f389;不定期分享源码&#xff0c;关注不丢失哦 文章目录 一、作品介绍二、作品演示三、代码目录四、网站代码HTML部分代码 五、源码获取 一、作品介绍 &#x1f3f7;️本套采用HTMLCSS&#xff0c;未使用Javacsript代码&#xff0c;共有1个页面。 二、作品演示 三、代…...

【ARMv7-A】——CP15 协处理器

文章目录 CP15 协处理器指令格式MCR 示例MRC 示例寄存器C0 identification registersC1 system control registersC2 memory protection and control registersC3 memory protection and control registersC4 Not usedC5 Memory system fault registers...

AI横扫各行各业,为什么唯独啃不动数字孪生?

当下AI技术席卷全网&#xff0c;画图、写代码、生成素材样样全能&#xff0c;让不少人产生了“AI万能”的认知错觉。行业内不断传出声音&#xff0c;声称AI将彻底取代数字孪生开发、替代技术从业者&#xff0c;实现项目全自动落地。但深耕数字孪生可视化领域的从业者都清楚&…...

打卡2026阿里云峰会

打卡2026阿里云峰会。 这次大会不仅在美丽的西湖边上&#xff0c; 还有几个新朋友要来。。...

Cortex-Debug架构深度解析:从GDB MI协议到VSCode调试体验的完整实现

Cortex-Debug架构深度解析&#xff1a;从GDB MI协议到VSCode调试体验的完整实现 【免费下载链接】cortex-debug Visual Studio Code extension for enhancing debug capabilities for Cortex-M Microcontrollers 项目地址: https://gitcode.com/gh_mirrors/co/cortex-debug …...

收藏必备!小白程序员快速入门RAG,解锁大模型知识检索与增强(干货满满)

本文详细介绍了RAG&#xff08;检索增强生成&#xff09;的概念、流程及优化策略。RAG通过从数据库检索上下文文档&#xff0c;有效提升LLM答案的准确性与时效性&#xff0c;解决纯生成模型的局限性。文章覆盖了文档加载、切分、向量化存储&#xff0c;以及检索与生成两个核心阶…...

长鑫存储逆袭:从近10年亏损超366亿到盈利超预期,能否成“中国海力士”?

长鑫存储逆袭&#xff1a;从巨亏到盈利超预期&#xff0c;能否成为“中国海力士”&#xff1f;“韩国巨头布局存储&#xff0c;中国巨头热衷于外卖。”这一波存储涨价潮&#xff0c;很多人用戏谑的方式来表达对中国几家互联网公司的“恨铁不成钢”。但长鑫存储却凭借一份极度亮…...

直线模组选型别再“先选电机“了!导程才是起点(附正向推导五步法)

引言&#xff1a;一个高频"翻车"现场在直线模组&#xff08;丝杆模组&#xff09;选型中&#xff0c;有个环节经常出现逆向翻车——工程师先选好了电机&#xff0c;再去配丝杆导程&#xff0c;结果发现&#xff1a;❌ 速度上不去❌ 推力不够大❌ 电机严重发热问题的根…...

AD导出Gerber文件时,单位选英寸格式选2:5?一文讲透这些‘祖传’设置背后的原因

为什么PCB工程师至今仍在使用英寸和2:5格式导出Gerber文件&#xff1f; 在PCB设计领域&#xff0c;有一个看似奇怪却普遍存在的现象&#xff1a;即使全球绝大多数国家采用公制单位&#xff0c;工程师们在导出Gerber文件时却坚持使用英制单位&#xff08;英寸&#xff09;&#…...

图数据库 TuGraph 基本操作 作业一

一、基础知识介绍(一) 图数据库图数据库以顶点 (Vertex / Node)、边 (Edge / Relationship) 与属性 (Property) 三种元素表达事物及其关联关系。顶点对应实体, 边对应实体之间的关系, 属性以键值对形式附着在顶点或边上。相较关系数据库, 图数据库把 "关系" 提升为存…...

Google I/O 2026发布Gemini 3.5 Flash:性能超越3.1 Pro,输出速度快4倍!

Google在I/O 2026上正式发布Gemini 3.5 Flash&#xff0c;这是其最新一代结合前沿智能与行动能力的模型系列&#xff0c;在多项基准测试中表现出色&#xff0c;输出token速度更是其他前沿模型的4倍。 性能卓越 3.5 Flash定位为迄今最强的Agentic和编程模型&#xff0c;在Termin…...

别再混淆了!一张图看懂SAP特殊采购类40、70、80的核心区别与适用场景

深度解析SAP特殊采购类40/70/80&#xff1a;业务逻辑与实战选型指南 引言 在SAP供应链管理的复杂生态中&#xff0c;特殊采购类&#xff08;Special Procurement Type&#xff09;是连接多工厂协同的神经中枢。当企业面临跨工厂物料调配、集中采购或分布式生产等场景时&#xf…...