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

有趣的HTML实例(十三) 咖啡选择(css+js)

一个人追求目标的路途是孤单的,一个人独品辛酸的时候是寂寥的,一个人马不停蹄的追赶着,狂奔着,相信前方是一片光明,我从不放弃希望,就像我对生活的信念,没有人可以动摇。

——《北京青年》


目录

一、前言

二、往期作品回顾

三、作品介绍

四、本期代码介绍

五、效果显示 

六、编码实现

index.html

style.css 

script.js

 七、获取源码

公众号获取源码 

获取源码?私信?关注?点赞?收藏?


一、前言

        在我们的 html 学习过程中,会用到并见识到各种各样的实例,以及各种插件,并且有些 web 网页中的小插件又非常的吸引眼球,提升 web 网页的层次,显得非常好看并且非常使用。在本系列中,我将持续为大家更新有趣且使用的 html 实例,放在 web 网页中,凸显效果。

        特点一:都是符合学校或者学生考试期末作业的水平,都是最基础的简单的 html 样例,提升web网页整理效果,都是 div+css 框架原创代码写的,内容包括 js / css,也包含 视频+音乐+flash 等元素的插入…

        特点二:内容包括多种丰富类型,例如: 倒计时,404页面,Blog顶置卡片设计 (css+js),To-Do-List设计 (css+js),火柴盒动画 (css),日历便签设计 (css+js),搜索框设计 (css+js),卡片式图片展示 (css+js),咖啡选择 (css+js)……

     

          可满足多种需求,欢迎大家下载!

 


二、往期作品回顾

有趣的HTML实例(一) 倒计时_Enovo_飞鱼的博客-CSDN博客

有趣的HTML实例(二) 404页面_Enovo_飞鱼的博客-CSDN博客

有趣的HTML实例(三) 加载页面动画_Enovo_飞鱼的博客-CSDN博客

有趣的HTML实例(四) 旋转菜单_Enovo_飞鱼的博客-CSDN博客

有趣的HTML实例(五) 加载页面动画Ⅱ(css)_Enovo_飞鱼的博客-CSDN博客

有趣的HTML实例(六) 卡片翻转时钟_Enovo_飞鱼的博客-CSDN博客

有趣的HTML实例(七) 注册登录界面Ⅱ(css+js)_Enovo_飞鱼的博客-CSDN博客

有趣的HTML实例(八) 一个很有趣的动态背景(css+js)_Enovo_飞鱼的博客-CSDN博客

有趣的HTML实例(九) 文本变形动画(css+js)_Enovo_飞鱼的博客-CSDN博客

有趣的HTML实例(十) 悬停时有旋转效果的图标_Enovo_飞鱼的博客-CSDN博客

有趣的HTML实例(十一) 烟花特效(css+js)_Enovo_飞鱼的博客-CSDN博客

有趣的HTML实例(十二) 早安、晚安动画(css+js)_Enovo_飞鱼的博客-CSDN博客


三、作品介绍

        1.作品简介 :HTML响应式布局网站源码!兼容 pc 以及移动端,内涵 js 交互,ui 交互。直接点击即可查看效果!

        2.作品编辑:个人主页网页设计题材,代码为 html+css 布局制作,作品下载后可使用任意HTML编辑软件(例如:DW、HBuilder、Vscode 、Sublime  所有编辑器均可使用)。

        3.作品技术:使用DIV+CSS制作了网页背景图、鼠标经过及选中导航变色效果、下划线等。


四、本期代码介绍

一款简单的 HTML+ CSS+JS  咖啡选择(css+js)  实例

1、HTML

2、CSS

3、JS

4、舒适的画面感

5、咖啡

6、各种不同类型咖啡点击效果

 可通用多种不同情景,放置在web网页上,可以作为跳转页面之后使用


五、效果显示 

可使用在多种情景下,提升层次轮廓效果、美化界面、自定义文字修改——>

根据需求修改


六、编码实现


显示完整代码

注意路径(⊙o⊙)?

o(* ̄▽ ̄*)ブ 

index.html

<!DOCTYPE html>
<html lang="en" >
<head><meta charset="UTF-8"><title>咖啡</title><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
<link rel="stylesheet" href="./style.css"></head>
<body>
<!-- partial:index.partial.html -->
<!-- <a href="https://twitter.com/rominamartinlib" target="_blank"><svg viewBox="328 355 335 276" xmlns="http://www.w3.org/2000/svg"><path d="M 630, 425A 195, 195 0 0 1 331, 600A 142, 142 0 0 0 428, 570A  70,  70 0 0 1 370, 523A  70,  70 0 0 0 401, 521A  70,  70 0 0 1 344, 455A  70,  70 0 0 0 372, 460A  70,  70 0 0 1 354, 370A 195, 195 0 0 0 495, 442A  67,  67 0 0 1 611, 380A 117, 117 0 0 0 654, 363A  65,  65 0 0 1 623, 401A 117, 117 0 0 0 662, 390A  65,  65 0 0 1 630, 425Z" style="fill:#3BA9EE;" /></svg>
</a> -->
<div class="options"><button id="americano">Americano</button><button id="au_lait">Au lait</button><button id="capuccino">Capuccino</button><button id="corretto">Corretto</button><button id="espresso">Espresso</button><button id="latte">Latte</button><button id="lungo">Lungo</button><button id="macchiato">Macchiato</button><button id="mocha">Mocha</button><button id="ristretto">Ristretto</button>
</div>
<div class="container"><h1 class="coffee_name">Choose your coffee</h1><div class="cup"><div class="filling reset"><div class="coffee">Coffee</div><div class="water">Water</div><div class="liquor">Liquor</div><div class="milk">Milk</div><div class="whipped_cream">Whipped cream</div><div class="milk_foam">Milk foam</div><div class="steamed_milk">Steamed milk</div><div class="chocolate">Chocolate</div></div><div class="plate"></div></div>
</div>
<!-- partial --><script  src="./script.js"></script></body>
</html>

style.css 

:root {--main-bg-color: #d6b9a4;--cup-color: #474747;--cup-width: 30vw;--cup-height: 24vw;--cup-handle-width: 5vw;--cup-handle-height: calc(2 * var(--cup-handle-width));--cup-border-width: 2vw;--cup-inside-width: calc(var(--cup-width) - var(--cup-border-width));--cup-inside-height: calc(var(--cup-height) - var(--cup-border-width));--border-width: 1vw;--main-border: var(--border-width) solid var(--cup-color);--plate-width: 25vw;--plate-height: 2vw;--coffee-bottom: 80%;--water-bottom: 0;--milk-bottom: 0;--liquor-bottom: 0;--whipped_cream-bottom: 0;--steamed_milk-bottom: 0;--milk_foam-bottom: 0;--chocolate-bottom: 0;--coffee-color: #3c302f;--water-color: #b1dce2;--milk-color: #f0ebe5;--liquor-color: #fc8626;--whipped_cream-color: #fceecb;--milk_foam-color: #fceecb;--steamed_milk-color: #ffd7b3;--chocolate-color: #391e09;}body {height: 100vh;width: 100vw;background: var(--main-bg-color);display: flex;justify-content: space-evenly;align-items: center;margin: auto;overflow: hidden;}a {position: absolute;top: 10px;left: 10px;}svg {height: 1.5rem;}.container {display: flex;flex-direction: column;align-items: center;justify-content: center;width: 70vw;}.coffee_name {color: #f1faee;text-align: center;/*   width: 100%; */font-size: 4vw;}.options {display: grid;grid-gap: 1vh;grid-template-rows: repeat(10, 35px);grid-template-columns: 120px;justify-content: space-evenly;box-sizing: border-box;}.options button {-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;background: rgba(214, 217, 227, 0.6);outline: none;font-size: 1rem;border: 2px solid #a67a60;box-shadow: none;color: #363636;box-sizing: border-box;border-radius: 1vh;}.options button:hover {cursor: pointer;border-width: 4px;background: rgba(255, 255, 255, 0.6);}.options .selected {border-width: 4px;background: rgba(255, 255, 255, 0.8);box-sizing: border-box;}.cup {width: var(--cup-width);height: var(--cup-height);border-radius: 0 0 10vw 10vw;position: relative;background-color: var(--cup-color);z-index: 10;box-sizing: border-box;}.cup::after {content: "";position: absolute;top: 10%;left: calc(100% - 1vw);width: var(--cup-handle-width);height: var(--cup-handle-height);border: var(--main-border);border-radius: 50% 30%;}.plate {position: absolute;top: calc(100% + 1vw);left: calc((var(--cup-width) - var(--plate-width)) / 2);width: var(--plate-width);background: var(--cup-color);height: var(--plate-height);border-radius: 1vw;}.filling {position: absolute;left: calc(var(--cup-border-width) / 2);bottom: calc(var(--cup-border-width) / 2);width: var(--cup-inside-width);height: var(--cup-inside-height);overflow: hidden;border-radius: 0 0 10vw 10vw;background-color: var(--main-bg-color);bottom: 1vw;}.filling div {position: absolute;width: 100%;transition: all 1s linear;color: #817f75;display: flex;align-items: flex-start;justify-content: center;height: 0;overflow: hidden;font-size: 3vw;height: 100%;bottom: -100%;box-sizing: border-box;}.filling.reset.americano {--water-bottom: 0;--coffee-bottom: -60%;}.filling.reset.au_lait {--coffee-bottom: -50%;--milk-bottom: 0%;}.filling.reset.capuccino {--coffee-bottom: -65%;--steamed_milk-bottom: -35%;--milk_foam-bottom: 0;}.filling.reset.espresso {--coffee-bottom: -60%;}.filling.reset.latte {--coffee-bottom: -60%;--steamed_milk-bottom: -20%;--milk_foam-bottom: 0%;}.filling.reset.corretto {--coffee-bottom: -45%;--liquor-bottom: -25%;}.filling.reset.lungo {--water-bottom: 0;--coffee-bottom: -50%;}.filling.reset.macchiato {--coffee-bottom: -70%;--milk_foam-bottom: 0;}.filling.reset.mocha {--coffee-bottom: -60%;--chocolate-bottom: -40%;--steamed_milk-bottom: -20%;--whipped_cream-bottom: 0%;}.filling.reset.ristretto {--coffee-bottom: -80%;}div.chocolate {background: var(--chocolate-color);bottom: var(--chocolate-bottom);z-index: 6;}div.coffee {background: var(--coffee-color);bottom: var(--coffee-bottom);line-height: 4vw;z-index: 7;}div.liquor {background: var(--liquor-color);bottom: var(--liquor-bottom);z-index: 4;}div.milk {background: var(--milk-color);bottom: var(--milk-bottom);z-index: 2;}div.milk_foam {background: var(--milk_foam-color);bottom: var(--milk_foam-bottom);z-index: 5;}div.steamed_milk {background: var(--steamed_milk-color);bottom: var(--steamed_milk-bottom);z-index: 6;}div.water {background: var(--water-color);bottom: var(--water-bottom);}div.whipped_cream {background: var(--whipped_cream-color);bottom: var(--whipped_cream-bottom);z-index: 4;}.filling.reset {--coffee-bottom: -100%;--water-bottom: -100%;--milk-bottom: -100%;--liquor-bottom: -100%;--whipped_cream-bottom: -100%;--steamed_milk-bottom: -100%;--milk_foam-bottom: -100%;--chocolate-bottom: -100%;}

script.js

const coffee_name = document.querySelector(".coffee_name");
const coffee_filling = document.querySelector(".filling");
const buttons = document.querySelectorAll("button");
let current_element = null;const changeCoffeeType = (selected) => {if (current_element) {current_element.classList.remove("selected");coffee_filling.classList.remove(current_element.id);}current_element = selected;coffee_filling.classList.add(current_element.id);current_element.classList.add("selected");coffee_name.innerText = selected.innerText;
};const setActiveType = (element) => {element.toggleClass("selected");
};[...buttons].forEach((button) => {button.addEventListener("click", () => {changeCoffeeType(button);});
});

 七、获取源码

老规矩,先给朋友们看一下完整文件夹,

正确的文件如下图 ,复制源码的朋友们请注意了!!!

公众号获取源码 

第一步,通过微信公众号下载源码压缩包,解压并打开文件夹,即为上图样式(复制源码请注意路径及文件名)

第二步,点击 html 文件 打开即可查看


2023年第二十三期,希望得到大家的喜欢🙇‍

也是新的系列,将会持续更新,🙇‍

希望大家有好的意见或者建议,欢迎私信


以上就是本篇文章的全部内容了

 ~ 关注我,点赞博文~ 每天带你涨知识!

1.看到这里了就 [点赞+好评+收藏] 三连 支持下吧,你的「点赞,好评,收藏」是我创作的动力。

2.关注我 ~ 每天带你学习 :各种前端插件、3D炫酷效果、图片展示、文字效果、以及整站模板 、HTML模板 、C++、数据结构、Python程序设计、Java程序设计、爬虫等! 「在这里有好多 开发者,一起探讨 前端 开发 知识,互相学习」!

3.以上内容技术相关问题可以相互学习,可 关 注 ↓公 Z 号 获取更多源码 !
 

获取源码?私信?关注?点赞?收藏?

👍+✏️+⭐️+🙇‍

有需要源码的小伙伴可以 关注下方微信公众号 " Enovo开发工厂 ",回复 关键词 " a-coffee "

相关文章:

有趣的HTML实例(十三) 咖啡选择(css+js)

一个人追求目标的路途是孤单的&#xff0c;一个人独品辛酸的时候是寂寥的&#xff0c;一个人马不停蹄的追赶着&#xff0c;狂奔着&#xff0c;相信前方是一片光明&#xff0c;我从不放弃希望&#xff0c;就像我对生活的信念&#xff0c;没有人可以动摇。 ——《北京青年》 目录…...

【力扣-LeetCode】1139. 最大的以 1 为边界的正方形 C++题解

1139. 最大的以 1 为边界的正方形难度中等137收藏分享切换为英文接收动态反馈给你一个由若干 0 和 1 组成的二维网格 grid&#xff0c;请你找出边界全部由 1 组成的最大 正方形 子网格&#xff0c;并返回该子网格中的元素数量。如果不存在&#xff0c;则返回 0。示例 1&#xf…...

【JavaGuide面试总结】Redis篇·下

【JavaGuide面试总结】Redis篇下1.如何使用 Redis 事务&#xff1f;2.如何解决 Redis 事务的缺陷&#xff1f;3.说说Redis bigkey吧4.大量 key 集中过期问题怎么解决的5.如何保证缓存和数据库数据的一致性&#xff1f;6.缓存穿透有哪些解决办法&#xff1f;7.缓存击穿有哪些解决…...

ForkJoinPool原理

1、概述 Fork/Join框架是Java7提供了的一个用于并行执行任务的框架。ForkJoinPool是Java中提供了一个线程池&#xff0c;特点是用来执行分治任务。主题思想是将大任务分解为小任务&#xff0c;然后继续将小任务分解&#xff0c;直至能够直接解决为止&#xff0c;然后再依次将任…...

02 python基本语法和数据类型

基本语法 python脚本可以在python交互式shell或者代码编辑器中编写与运行。python文件的扩展名一般为.py python使用缩进来区分不同的代码块,此特性有利于提高代码可读性。 下面是一个简单的python条件语句代码: 小明=矮穷错 小红=白富美 小华=高富帅 小李=程序员某人 = &quo…...

【办公类-16-09】“2022下学期 大班运动场地分配表-跳过节日循环排序”(python 排班表系列)

样例展示&#xff1a;跳过节日的运动场地循环排序表&#xff08;8个班级8组内容 下学期一共20周&#xff09;背景需求&#xff1a;上学期做过一次大班运动场地安排&#xff0c;跳过节日。2023.2下学期运动场地排班&#xff08;跳过节日&#xff09;又来了。一、场地器械微调二、…...

全网多种方法分析解决HTTP Status 404资源未找到的错误,TCP的3次握手,dns域名解析,发起http请求以及cookie和session的区别

文章目录1. 文章引言2. 简述URL3. http完整请求3.1 DNS域名解析3.2 TCP的3次握手3.3 发起http请求3.4 浏览器解析html代码3.5 浏览器对页面进行渲染呈现给用户4. 解决404错误的方法5. 补充知识点5.1 cookie和session的区别5.2 ChatGPT的介绍1. 文章引言 正赶上最近ChatGPT很火…...

Django图书商场购物系统python毕业设计项目推荐

mysql数据库进行开发&#xff0c;实现了首页、个人中心、用户管理、卖家管理、图书类型管理、图书信息管理、订单管理、系统管理等内容进行管理&#xff0c;本系统具有良好的兼容性和适应性&#xff0c;为用户提供更多的网上图书商城信息&#xff0c;也提供了良好的平台&#x…...

基于模型预测控制(MPC)的悬架系统仿真分析

目录 前言 1.悬架系统 2.基于MPC的悬架系统仿真分析 2.1 simulink模型 2.2仿真结果 2.3 结论 3 总结 前言 模型预测控制是无人驾驶中较为热门的控制算法&#xff0c;但是对于悬架等这类系统的控制同样适用。 我们知道模型预测控制主要可以划分为三个部分&#xff1a; …...

Word处理控件Aspose.Words功能演示:使用 Java 拆分 MS Word 文档

Aspose.Words 是一种高级Word文档处理API&#xff0c;用于执行各种文档管理和操作任务。API支持生成&#xff0c;修改&#xff0c;转换&#xff0c;呈现和打印文档&#xff0c;而无需在跨平台应用程序中直接使用Microsoft Word。此外&#xff0c;API支持所有流行的Word处理文件…...

图扑数字孪生智慧机场,助推民航“四型机场“建设

前言 民航局印发的《智慧民航建设路线图》文件中&#xff0c;明确提出智慧机场是智慧民航的四个核心抓手之一。并从机场全域协同运行、作业与服务智能化、智慧建造与运维方面&#xff0c;为智慧机场的发展绘制了清晰的蓝图。 效果展示 图扑软件应用自主研发核心产品 HT for …...

内网安装管家婆软件如何实现外网访问?内网穿透的几种方案教程

管家婆软件从网络架构上分两种版本&#xff1a;web&#xff08;浏览器http端口&#xff09;访问的版本和客户端&#xff08;211固定端口sqlserver数据库&#xff09;访问的版本。公司库管经常用仓库登录管家婆&#xff0c;一旦需要在公司外部登陆访问管家婆客户端&#xff0c;就…...

CCNP350-401学习笔记(1-50题)

1、Which function does a fabric edge node perform in an SD-Access deployment?A. Connects endpoints to the fabric and forwards their traffic. B. Encapsulates end-user data traffic into LISP. C. Connects the SD-Access fabric to another fabric or external La…...

基于微信小程序的新冠肺炎服务预约小程序

文末联系获取源码 开发语言&#xff1a;Java 框架&#xff1a;ssm JDK版本&#xff1a;JDK1.8 服务器&#xff1a;tomcat7 数据库&#xff1a;mysql 5.7/8.0 数据库工具&#xff1a;Navicat11 开发软件&#xff1a;eclipse/myeclipse/idea Maven包&#xff1a;Maven3.3.9 浏览器…...

网站项目部署在k8s案例与Jenkins自动化发布项目(CI/CD)

在K8s平台部署项目流程 在K8s平台部署Java网站项目 制作镜像流程 第一步&#xff1a;制作镜像 使用镜像仓库&#xff08;私有仓库、公共仓库&#xff09;&#xff1a; 1、配置可信任&#xff08;如果仓库是HTTPS访问不用配置&#xff09; # vi /etc/docker/daemon.json { "…...

网络原理 (1)

网络原理 文章目录1. 前言&#xff1a; 2. 应用层2.1 XML2.2 json2.3 protobuffer3. 传输层3.1 UDP3.1 TCP4. TCP 内部的工作机制 &#xff08;重点&#xff09;1. 确认应答 2.超时重传3. 连接管理3.1 建立联系 &#xff1a;三次握手3.2 断开连接 : 四次挥手4. 滑动窗口5. 流量…...

LeetCode-1139. 最大的以 1 为边界的正方形【前缀和,矩阵】

LeetCode-1139. 最大的以 1 为边界的正方形【前缀和&#xff0c;矩阵】题目描述&#xff1a;解题思路一&#xff1a;前缀和。前缀和来记录边长。解题思路二&#xff1a;0解题思路三&#xff1a;0题目描述&#xff1a; 给你一个由若干 0 和 1 组成的二维网格 grid&#xff0c;请…...

windows10/11,傻瓜式安装pytorch(gpu),在虚拟环境anaconda

安装anaconda地址 &#xff1a;Anaconda | The Worlds Most Popular Data Science Platform安装选项全默认点击next就行。查看支持cuda版本cmd命令行输入nvidia-smi。下图右上角显示11.6为支持的cuda版本。要是显示没有nvidia-smi命令。得安装nvidia驱动&#xff0c;一般情况都…...

Revit导出PDF格式图纸流程及“批量导出图纸”

一、Revit导出PDF格式图纸流程 1、点击左上方“应用程序菜单”即“R”图标&#xff0c;进择“打印”选项。 2、在弹出的对话框中&#xff0c;需要设置图纸“打印范围”&#xff0c;选择“所选的视图/图纸选项”&#xff0c;点击“选择”&#xff0c;按钮&#xff0c;选择我们需…...

【自学Linux】 Linux文件目录结构

Linux文件目录结构 Linux文件目录结构教程 在 Linux 中&#xff0c;有一个很经典的说法&#xff0c;叫做一切皆文件&#xff0c;因此&#xff0c;我们在系统学习 Linux 之前&#xff0c;首先要了解 Linux 的文件目录结构。Linux 主要的目录有三大类&#xff0c;即根目录(/)&a…...

如何让APP在Google Play中成为特色

Google Play覆盖了 190 多个地区&#xff0c;数十亿的用户&#xff0c;所以开发者都会希望APP在应用商店中获得推荐位。 Google Play 上的精选热门应用类型&#xff1a;热门游戏或应用&#xff0c;畅销应用&#xff0c;安装量增长的应用&#xff0c;产生最多收入的应用。 那么…...

【C++】cin的处理过程

使用cin进行输入时&#xff0c;程序将输入视为一系列的字节&#xff0c;其中每个字节都被解释为字符编码。不管目标数据 类型是什么&#xff0c;输入一开始都是字符数据——文本数据。然后&#xff0c;cin对象负责将文本转换为其他类型。 为说明这是如何完成的&#xff0c;来看…...

读取Sentinel和Landsat 压缩包数据,直接进行波段重组、影像裁剪或者匀色镶嵌处理

波段重组在软件中查找&#xff1a;菜单栏-》影像基本处理-》波段处理-》波段重组&#xff0c;弹出如下对话框&#xff1a;根据对话框中的提示&#xff0c;输入需要处理的数据。注意&#xff1a;1、输入数据添加之后&#xff0c;需要点击其中任意一条数据&#xff0c;获取数据波…...

Yakit Web Fuzzer 终极能力强化:热加载 Fuzz

Background 在 HTB&#xff1a;BountyHunter 中&#xff0c;我们发现 Web Fuzzer 在使用中可以 “更强”&#xff0c;我们需要编写 Yak 脚本的事情&#xff0c;如果可以经过某些 Web Fuzzer 的优化&#xff0c;可以达到同样的效果。 在一个标签中&#xff0c;我们实现{{base6…...

Qt新手入门指南 - 如何创建模型/视图(三)

每个UI开发人员都应该了解ModelView编程&#xff0c;本教程的目标是为大家提供一个简单易懂的介绍。Qt 是目前最先进、最完整的跨平台C开发工具。它不仅完全实现了一次编写&#xff0c;所有平台无差别运行&#xff0c;更提供了几乎所有开发过程中需要用到的工具。如今&#xff…...

【Spring】手动实现简易AOP和IOC

前言 XML&#xff1a;通过Dom4j对XML进行解析和验证。 IOC&#xff1a;通过获取要创建对象的Class类型、构造函数后&#xff0c;通过反射来实现。 AOP&#xff1a;通过使用JDK动态代理和Cglib动态代理实现。 一、解析XML 1.1、解析bean标签 /*** 解析bean标签* param xmlBean…...

EasyExcel的使用

这里写目录标题先导入依赖最简单的写最简单的读項目开发中的一些操作xml一定要默認放先导入依赖 <dependencies><dependency><groupId>com.alibaba</groupId><artifactId>easyexcel</artifactId><version>2.1.7</version><…...

基础篇(-1)-java特点、JDK、JRE、JVM区别、字节码编译、跨平台、程序运行

文章目录1.Java的特点有哪些&#xff1f;2.JDK和JRE和JVM的区别3.Java为什么采用字节码编译&#xff1f;4.什么是跨平台&#xff1f;5.Java程序从源代码到运行需要三步&#xff1f;1.Java的特点有哪些&#xff1f; Java是一种编程语言&#xff0c;被特意设计用于互联网的分布式…...

【网络编程】Java快速上手InetAddress类

概念 Java具有较好的网络编程模型/库&#xff0c;其中非常重要的一个API便是InetAddress。在Java.net 网络编程中中有许多类都使用到了InetAddress 这个类代表一个互联网协议&#xff08;IP&#xff09;地址。 IP地址是一个32&#xff08;IPV4&#xff09;位或128&#xff08;…...

小小bat-day1-自动文件上传

前言&#xff1a;日常服务器备份文件或者生产设备等数据文件都统一保存至文件服务器&#xff0c;进行日志分析或者将生产文件CSV、图片等转存至数仓进行数据分析&#xff0c;尤其生产的部分数据是保存在个人电脑的PC端&#xff0c;数据杂&#xff0c;获取困难&#xff0c;手动整…...

建网站与发布网站/网络公司网站建设

对于那些vim初学者&#xff0c;强烈建议看看这个交互式的vim教程。 记录我总结的VIM技巧 一、删除 &#xff08;1&#xff09;d/text 删除从文本中出现“text”中所指定字样的位置&#xff0c;一直向前直到下一个该字样所出现的位置&#xff08;但不包括该字 样&#xf…...

wordpress忘记管理员/googleseo服务公司

一 top命令 -H&#xff1a;开启线程 -p: 进程号 1.使用 top -H -p pid(具体的进程号) 查看该进程下所有线程占用CPU情况 2.pstack保存该进程的线程快照&#xff1a;根据命令下输出的线程id&#xff0c;查看体线程堆栈信息。...

广东门户网站建设/seo与sem的关系

首先来看一张即时通讯里的一个用例图。 看这张图&#xff0c;第一反应是乱&#xff0c;没条理。再来分析下这张图&#xff0c;管理好友可以理解成一级用例&#xff0c;实际上它是一个虚拟用例&#xff0c;查找好友是个二级用例&#xff0c;以后的操作都是建立在查找好友的基础上…...

网站如何申请/合肥今日头条最新消息

自从AlphaGo和柯洁一战之后&#xff0c;围棋这项古老的智力博弈又开始焕发起了新的活力。它不再只是停留在小众圈子里的黑白搏杀&#xff0c;而是作为凝结了人类智慧的顶端游戏&#xff0c;被更多人所关注。今年&#xff0c;围棋界顶级赛事迎来全新的独家冠名合作伙伴——华为手…...

php网站建设个人总结/全网营销

目录 零、前言 一、如何评价机器人运动规划的性能 二、有动态障碍物的情况下&#xff0c;如何实现移动机器人的安全避障 三、关于B样条曲线运动规划的讨论 四、什么样的曲线才是适合机器人跟踪的曲线 五、关于目前常用的路径/轨迹规划方法 六、关于机器人的全局规划与局…...

珠海网站建设怎样/海南seo快速排名优化多少钱

电缆调制解调器又名线缆调制解调器(Cable Modems) , 是种可以同时连接有线电视网络和宽带网络的网络设备。通常在运营商向用户同时提供广播电视节目和互联网时会安装此类设备&#xff0c;目前大多数地区都在广泛使用此类设备。日前来自丹麦的安全团队发现使用博通芯片组的电缆…...