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

html练习

1.用户注册界面
代码:

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title></head><body><form action="#" method="get"><table border="1" width="500" height="700"><thead><tr align="center"><td colspan="2" bgcolor="#ccc">用户注册</td></tr><tr ><td bgcolor="#eee" align="center">用户名</td><td bgcolor="#eee" align="left"><input type="text" name="name"></td></tr><tr><td bgcolor="#eee" align="center">密码</td><td bgcolor="#eee" ><input type="password" name="password"></td></tr><tr><td bgcolor="#eee" align="center">性别</td><td bgcolor="#eee" ><input type="radio" name="sex" value="man" ><input type="radio" name="sex" value="woman" ></td></tr><tr><td bgcolor="#eee" align="center">爱好</td><td bgcolor="#eee"><input type="checkbox" name="hobby" value="write" >写作<input type="checkbox" name="hobby" value="music">听音乐<input type="checkbox" name="hobby" value="sing">唱歌						 </td></tr><tr><td bgcolor="#eee" align="center">省份</td><td bgcolor="#eee"><input type="hidden" id="hidden"><select name="province" id=""><option >广东省</option><option >四川省</option><option >广西省</option><option >陕西省</option></select> </td></tr><tr><td bgcolor="#eee" align="center" width="100" height="150">自我介绍</td><td bgcolor="#eee"><textarea name="introduce myself" id="" cols="55" rows="10"> </textarea></td></tr><tr align="center"><td bgcolor="#ddd" colspan="2"><input type="submit" value="提交" />	 <input type="reset" value="重置" /></td></tr></thead></table></form></body>
</html>

效果:
在这里插入图片描述

2.仿淘宝商品界面
代码:

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title><style>.goods{width: 220px;height: 360px;border: 1px solid  #f40;}img{width: 220px; }.menu>li:hover{background-color: #f40;color: white;}.menu{width: 220px;height: 20px;background-color: black;list-style: none;text-align: center;padding: 0%;margin-top: -3.55px;}.menu > li{width: 110px;border: none;float: left;}.price{margin-left: 5px;margin-right: 5px;}.price > span{line-height: 20px;vertical-align: middle;}.price > span:first-child{color: #f40;font-size: 20px;font-weight: bold;}.price > span:nth-child(2){font-size: 12px;background-color: #f40;color: white;padding-left: 1px ;padding-right: 1px;}.price > span:last-child{float: right;font-size: 12px;color: #888;}#des{margin-left: 5px;margin-right: 5px;}#des>a{color: #444;font-size: 9px;text-decoration: none;}#des>a:hover{text-decoration: underline;color: #999;}#des>a:nth-child(2){color: #f40;}#des1{margin-left: 5px;margin-right: 5px;}#des1 > a{line-height: 50px;vertical-align: center;}#des1>a{color: #888;font-size: 8px;}#des1>a:last-child{float: right;font-size: 8px;text-decoration: none;}#pho > img{width: 20px;height: 20px;margin-left: 5px;margin-right: 5px;}#pho > :nth-child(2){margin-left: -5px;}#pho > img:last-child{width: 25px;height: 25px;float: right;}</style></head><body><div class="container"><div class="goods"><img src="./2.png" alt="loading..."><ul class="menu"><li>找同款</li><li>找相似</li></ul><div class="price"><span>¥19999.00</span><span>包邮</span><span>0人付款</span></div><div id="des"><a href="#">欧兰薇雅</a><a href="#">欧洲进口水晶珍珠水晶珍珠</a><a href="#">戒指</a><a href="#">女食指指环心形 礼物</a></div><div id="des1"><a href="#">欧兰薇雅旗舰店</a><a href="#">上海</a></div><div id="pho"> <img src="./4.png" alt="loading..."><img src="./5.png" alt="loading..."><img src="./6.png" alt="loading..."></div></div></div></body>
</html>

效果:
在这里插入图片描述

在这里插入图片描述
在这里插入图片描述

相关文章:

html练习

1.用户注册界面 代码&#xff1a; <!DOCTYPE html> <html><head><meta charset"utf-8"><title></title></head><body><form action"#" method"get"><table border"1" widt…...

【Redis】Redis 是如何保证高可用的?(背诵版)

Redis 是如何保证高可用的&#xff1f;1. 说一下 Redis 是如何保证高可用的&#xff1f;2. 了解过主从复制么&#xff1f;2.1 Redis 主从复制主要的作用是什么?2.2 Redis 主从模式的拓扑结构&#xff1f;&#xff08;1&#xff09;一主一从结构&#xff08;2&#xff09;一主多…...

Qt---去掉标题栏后,最大化应用程序窗口时,窗口遮住了任务栏

// showMaximized(); // Qt最大化显示函数 任务栏都会覆盖static bool max false;static QRect location this->geometry();if (max) {this->setGeometry(location);//回复窗口原大小和位置// ui->maxBtn->setIcon(QIcon(":/MAX_.png"));}else {// ui-…...

Cadence Allegro 导出Netin(non-back)报告详解

⏪《上一篇》   🏡《上级目录》   ⏩《下一篇》 目录 1,概述2,Netin(non-back)作用3,Netin(non-back)示例4,Netin(non-back)导出方法4.1,方法1:4.2,方法2:B站关注“硬小二”浏览更多演示视频...

HTML语言

1.什么是HTML&#xff1f; 1、HTML是超文本标记语言&#xff08;Hyper Text Markup Language&#xff09; 2、HTML由各种各样的标签(tag)组成&#xff0c;如、 3、HTML文档 网页   (1)一种纯文本文件&#xff0c;扩展名为.html或.html&#xff1b;   (2)最终显示结果取决…...

线性代数之行列式

一、思维导图二、二阶、三阶行列式的定义1、二阶行列式2、三阶行列式沙路法展开3、解方程3.1解二元一次方程组观察上面两个未知量的值不难发现&#xff0c;它 们的分母均是上述方程组未知量的系数形成的二阶行列式&#xff0c;&#x1d465;1的分子是将系数行列 式的第一列换成…...

【FPGA-Spirit_V2】小精灵V2开发板初使用

&#x1f389;欢迎来到FPGA专栏~小精灵V2开发板初使用 ☆* o(≧▽≦)o *☆嗨~我是小夏与酒&#x1f379; ✨博客主页&#xff1a;小夏与酒的博客 &#x1f388;该系列文章专栏&#xff1a;FPGA学习之旅 文章作者技术和水平有限&#xff0c;如果文中出现错误&#xff0c;希望大家…...

STL与其空间配置器

目录什么是STLSTL的六大组件STL的缺陷什么是空间配置器为什么需要空间配置器GI-STL空间配置器实现原理一级空间配置器二级空间配置器内存池SGI-STL中二级空间配置器设计SGI-STL二级空间配置器之空间申请前期的准备申请空间填充内存块向内存池中索要空间SGI-STL二级空间配置器之…...

leetcode刷题之回文链表

目录 做题思路 代码实现 1.找到链表的中间节点 2.反转中间节点之后的链表 3.判断倒置的后半部分的链表是否等于前半部分的链表 整体代码展示 总结&#xff1a; 这里是题目链接。 这道题目的意思是&#xff1a;判断该链表中后半部分倒置是否跟前半部分相同&#xff0c;如…...

复制带随机指针的链表最长连续递增序列数组的度写字符串需要的行数最短补全词

复制带随机指针的链表来源&#xff1a;杭哥138. 复制带随机指针的链表 - 力扣&#xff08;LeetCode&#xff09;typedef struct Node Node; Node* BuyNode(int x) {Node* newnode (Node*)malloc(sizeof(Node));newnode->valx;newnode->nextNULL;newnode->randomNULL;…...

「ML 实践篇」回归系统:房价中位数预测

文章目录1. 项目分析1. 框架问题2. 性能指标2. 获取数据1. 准备工作区2. 下载数据3. 查看数据4. 创建测试集3. 数据探索1. 地理位置可视化2. 寻找相关性3. 组合属性4. 数据准备1. 数据清理2. Scikit-Learn 的设计3. 处理文本、分类属性4. 自定义转换器5. 特征缩放6. 流水线5. 选…...

深度学习 Day27——利用Pytorch实现运动鞋识别

深度学习 Day27——利用Pytorch实现运动鞋识别 文章目录深度学习 Day27——利用Pytorch实现运动鞋识别一、查看colab机器配置二、前期准备1、导入依赖项并设置GPU2、导入数据三、构建CNN网络四、训练模型1、编写训练函数2、编写测试函数3、设置动态学习率4、正式训练五、结果可…...

Springboot 整合dom4j 解析xml 字符串 转JSONObject

前言 本文只介绍使用 dom4j 以及fastjson的 方式&#xff0c; 因为平日使用比较多。老的那个json也能转&#xff0c;而且还封装好了XML&#xff0c;但是本文不做介绍。 正文 ①加入 pom 依赖 <dependency><groupId>dom4j</groupId><artifactId>dom4j…...

网络安全实验——安全通信软件safechat的设计

网络安全实验——安全通信软件safechat的设计 仅供参考&#xff0c;请勿直接抄袭&#xff0c;抄袭者后果自负。 仓库地址&#xff1a; 后端地址&#xff1a;https://github.com/yijunquan-afk/safechat-server 前端地址&#xff1a; https://github.com/yijunquan-afk/safec…...

【MySQL】MySQL的事务

目录 概念 什么是事务? 理解事务 事务操作 事务的特性 事务的隔离级别 事务的隔离级别-操作 概念 数据库存储引擎是数据库底层软件组织&#xff0c;数据库管理系统&#xff08;DBMS&#xff09;使用数据引擎进行创建、查 询、更新和删除数据。 不同的存储引擎提供…...

Java分布式事务(七)

文章目录&#x1f525;Seata提供XA模式实现分布式事务_业务说明&#x1f525;Seata提供XA模式实现分布式事务_下载启动Seata服务&#x1f525;Seata提供XA模式实现分布式事务_转账功能实现上&#x1f525;Seata提供XA模式实现分布式事务_转账功能实现下&#x1f525;Seata提供X…...

二十八、实战演练之定义用户类模型、迁移用户模型类

1. Django默认用户模型类 &#xff08;1&#xff09;Django认证系统中提供了用户模型类User保存用户的数据。 User对象是认证系统的核心。 &#xff08;2&#xff09;Django认证系统用户模型类位置 django.contrib.auth.models.User&#xff08;3&#xff09;父类AbstractUs…...

Java Virtual Machine的结构 3

1 Run-Time Data Areas 1.1 The pc Register 1.2 Java Virtual Machine Stacks 1.3 Heap 1.4 Method Area JVM方法区是在JVM所有线程中共享的内存区域&#xff0c;在编程语言中方法区是用于存储编译的代码、在操作系统进程中方法区是用于存储文本段&#xff0c;在JVM中方法…...

linux ubuntu22 安装neo4j

环境&#xff1a;neo4j 5 ubuntu22 openjdk-17 neo4j 5 对 jre 版本要求是 17 及以上&#xff0c;且最好是 openjdk&#xff0c;使用比较新的 ubuntu 系统安装比较好&#xff0c; centos7 因为没有维护&#xff0c;yum 找不到 openjdk-17了。 官方的 debian 系列安装教程&a…...

模型实战(7)之YOLOv8推理+训练自己的数据集详解

YOLOv8推理+训练自己的数据集详解 最近刚出的yolov8模型确实很赞啊,亲测同样的数据集用v5和v8两个模型训练+预测,结果显示v8在检测精度和准确度上明显强于v5。下边给出yolov8的效果对比图: 关于v8的结构原理在此不做赘述,随便搜一下到处都是。1.环境搭建 进入github进行git…...

华为云AI开发平台ModelArts

华为云ModelArts&#xff1a;重塑AI开发流程的“智能引擎”与“创新加速器”&#xff01; 在人工智能浪潮席卷全球的2025年&#xff0c;企业拥抱AI的意愿空前高涨&#xff0c;但技术门槛高、流程复杂、资源投入巨大的现实&#xff0c;却让许多创新构想止步于实验室。数据科学家…...

在鸿蒙HarmonyOS 5中实现抖音风格的点赞功能

下面我将详细介绍如何使用HarmonyOS SDK在HarmonyOS 5中实现类似抖音的点赞功能&#xff0c;包括动画效果、数据同步和交互优化。 1. 基础点赞功能实现 1.1 创建数据模型 // VideoModel.ets export class VideoModel {id: string "";title: string ""…...

学校招生小程序源码介绍

基于ThinkPHPFastAdminUniApp开发的学校招生小程序源码&#xff0c;专为学校招生场景量身打造&#xff0c;功能实用且操作便捷。 从技术架构来看&#xff0c;ThinkPHP提供稳定可靠的后台服务&#xff0c;FastAdmin加速开发流程&#xff0c;UniApp则保障小程序在多端有良好的兼…...

渲染学进阶内容——模型

最近在写模组的时候发现渲染器里面离不开模型的定义,在渲染的第二篇文章中简单的讲解了一下关于模型部分的内容,其实不管是方块还是方块实体,都离不开模型的内容 🧱 一、CubeListBuilder 功能解析 CubeListBuilder 是 Minecraft Java 版模型系统的核心构建器,用于动态创…...

三体问题详解

从物理学角度&#xff0c;三体问题之所以不稳定&#xff0c;是因为三个天体在万有引力作用下相互作用&#xff0c;形成一个非线性耦合系统。我们可以从牛顿经典力学出发&#xff0c;列出具体的运动方程&#xff0c;并说明为何这个系统本质上是混沌的&#xff0c;无法得到一般解…...

【开发技术】.Net使用FFmpeg视频特定帧上绘制内容

目录 一、目的 二、解决方案 2.1 什么是FFmpeg 2.2 FFmpeg主要功能 2.3 使用Xabe.FFmpeg调用FFmpeg功能 2.4 使用 FFmpeg 的 drawbox 滤镜来绘制 ROI 三、总结 一、目的 当前市场上有很多目标检测智能识别的相关算法&#xff0c;当前调用一个医疗行业的AI识别算法后返回…...

学校时钟系统,标准考场时钟系统,AI亮相2025高考,赛思时钟系统为教育公平筑起“精准防线”

2025年#高考 将在近日拉开帷幕&#xff0c;#AI 监考一度冲上热搜。当AI深度融入高考&#xff0c;#时间同步 不再是辅助功能&#xff0c;而是决定AI监考系统成败的“生命线”。 AI亮相2025高考&#xff0c;40种异常行为0.5秒精准识别 2025年高考即将拉开帷幕&#xff0c;江西、…...

听写流程自动化实践,轻量级教育辅助

随着智能教育工具的发展&#xff0c;越来越多的传统学习方式正在被数字化、自动化所优化。听写作为语文、英语等学科中重要的基础训练形式&#xff0c;也迎来了更高效的解决方案。 这是一款轻量但功能强大的听写辅助工具。它是基于本地词库与可选在线语音引擎构建&#xff0c;…...

安宝特方案丨船舶智造的“AR+AI+作业标准化管理解决方案”(装配)

船舶制造装配管理现状&#xff1a;装配工作依赖人工经验&#xff0c;装配工人凭借长期实践积累的操作技巧完成零部件组装。企业通常制定了装配作业指导书&#xff0c;但在实际执行中&#xff0c;工人对指导书的理解和遵循程度参差不齐。 船舶装配过程中的挑战与需求 挑战 (1…...

推荐 github 项目:GeminiImageApp(图片生成方向,可以做一定的素材)

推荐 github 项目:GeminiImageApp(图片生成方向&#xff0c;可以做一定的素材) 这个项目能干嘛? 使用 gemini 2.0 的 api 和 google 其他的 api 来做衍生处理 简化和优化了文生图和图生图的行为(我的最主要) 并且有一些目标检测和切割(我用不到) 视频和 imagefx 因为没 a…...