响应式
关注
分享
扫一扫
文章平均质量分 91
响应式设计
海拥✘
CSDN 内容合伙人，全栈领域优质创作者，华为云享专家，阿里云专家博主，InfoQ、蓝桥云课签约作者，HDZ核心组成员，全网粉丝20万+。一枚爱好计算机科学，乐于分享技术与快乐的博主。
展开
-
基于 HTML+CSS+JS 的纸牌记忆游戏
💂 个人网站: 海拥 —— 一个乐于分享技术与快乐的博主🤟 版权: 本文由【海拥】原创、在CSDN首发、需要转载请联系博主💬 如果文章对你有帮助、欢迎关注、点赞、收藏(一键三连)和订阅专栏哦💅 想寻找共同摸鱼的小伙伴，请点击【摸鱼小游戏】直接跳到末尾 去评论区领书这节实验我们将使用 HTML、CSS 和 JavaScript 制作纸牌记忆游戏。让我们开始吧！在线演示戳这里👉 https://haiyong.site/lanqiao/17.html原创 2022-04-06 13:44:15 · 8999 阅读 · 4 评论 -
使用 HTML 和 CSS 创建响应式猫猫图片库
作者主页：海拥作者简介：CSDN全栈领域优质创作者、HDZ核心组成员、蝉联C站周榜前十粉丝福利：粉丝群 每周送四本书，每月送各种小礼品(搪瓷杯、抱枕、鼠标垫、马克杯等)直接跳到末尾 去评论区领书在本文中，我将向大家展示如何使用 HTML 和CSS 代码创建 响应式猫猫图片库。之前我也做了一个使用 HTML、CSS 和 JS 创建响应式可过滤的游戏+工具展示页面。我们会在一些图片壁纸类网站上看到这样的图片库。许多类型的图像整齐地排列在一起。这种原创 2021-11-05 08:59:57 · 30800 阅读 · 23 评论 -
如何决定响应式网站的 CSS 单位？
很高兴又见面了！在我们创建适合各种设备的响应式网站时，了解正确的CSS 单元很重要。但在深入研究决策之前，让我们对它们进行分类以便了解它们的类别。如何决定响应式网站的 CSS 单位？ px 单位 ％ 单位⚓ em 单位 rem 单位 vw 单位 vh 单位 wuhu ! 起飞 !概括总结1.绝对单位px - 像素pt - 点pc - Picasin - 英寸cm - 厘米mm - 毫米2.百分比单位百分比 % 单位3.相对单位相对于字体大小em re原创 2021-08-09 10:07:03 · 6349 阅读 · 36 评论 -
使用 HTML、CSS、JS 和 API 制作一个很棒的天气 Web 应用程序
今天我将使用 Weather 和 Unsplash API 以及倾斜效果和玻璃形态外观创建凉爽的天气应用程序⛅ Weather.io ☔⚓ 第 1 步 - 设置环境并收集所有资源 第 2 步 - 从 index.html 开始 第 3 步 - 设置索引文件的样式 第 4 步 - 获取 Weather API 和 Unsplash API 密钥 第 5 步 - 从 JavaScript 编码开始 第 6 步 - 免费托管您的网站！原创 2021-07-25 20:02:17 · 45959 阅读 · 172 评论 -
20+免费精美响应式Html5 网站模板01(含源码)
今天花了几个小时的时间整理了一些响应式网站模板，代码下载方式放在了文章末尾，有什么问题可以私信我或者评论区留言，此文章为系列文章，后面还会继续更新网站模板0203等等原创 2021-06-02 16:17:25 · 19814 阅读 · 152 评论 -
超赞圆形动画进度条，爱了爱了(使用HTML、CSS和bootstrap框架)
使用HTML和CSS的圆形动画进度条使用HTML和CSS的圆形动画进度条步骤1：创建进度栏的结构步骤2：使用CSS代码设计圆形步骤3：在进度栏中添加加载动画步骤4：添加其他颜色以使加载动画更清晰源码下载更多相关在本文中，我将向您展示如何仅使用HTML、CSS和Boostrap框架创建圆形的动画进度条。之前，我已经设计了更多类型的动画进度条，但是这种设计是采用完全现代的方式设计的。动画圆形进度栏是一种统计设计，可用于各种网站。它主要用于指示个人在投资组合网站或个人网站中所占资格的百分比。它是完全动画的，也原创 2021-05-25 16:25:26 · 4858 阅读 · 72 评论 -
Minima黑色响应式后台管理模板
Minima黑色响应式后台管理模板基于Bootstrap3.3.4制作，黑色风格，兼容PC端和手机移动端，全套模板，包括登录、仪表盘、按钮、窗口部件、网格布局、图表等后台模板页面。模板截图代码截图主要HTMLindex.html<!DOCTYPE html><html> <head> <title>Minimal 1.0 - Dashboard</title> <meta name="viewport".原创 2021-05-16 22:11:55 · 5275 阅读 · 9 评论 -
使用HTML和CSS教程构建Glass网站
使用HTML和CSS教程构建Glass网站HTML代码CSS 代码源码获取1.CSDN下载地址：2.关注作者公众号相关内容了解带有HTML和CSS教程的Build Glass网站。使用HTML和CSS在您的网站上添加Glass效果。为初学者学习HTML的简便方法。通过遵循我的Youtube视频教程，您可以轻松地建立这个Glass网站。我还为您提供HTML，CSS和Js代码，可帮助您理解本教程。HTML代码这是基本的HTML，对所有HTML文件都很重要。我使用Google的样式在此HTML文件中导入P原创 2021-04-14 18:03:27 · 5258 阅读 · 1 评论 -
开发人员的终极VueJS资源
什么是VueJS？好吧，Vue是用于构建用户界面的渐进式框架。它是从头开始设计的，可以根据您的目标轻松地成为库和框架。它由专注于视图层的核心库和支持库的生态系统组成。Vue由Evan You创建。他创建Vue作为渐进式JavaScript框架和Angular的高性能替代品。如果您使用的是VueJS，则Vuexy VueJS管理模板可以作为启动项目的好资源。现在，让我们开始。原创 2021-04-11 02:21:03 · 5229 阅读 · 1 评论 -
一个基于HTML的可定制轮盘——帮你告别选择困难症
基于HTML的旋转转盘—小于30kb的可定制轮盘????演示链接：http://haiyongcsdn.gitee.io/spin-the-wheel/我非常希望并感谢大家对改进它提出任何反馈，我已经盯着它看了一个星期????我一直在为棋盘游戏玩家建立一个简单工具的网站。由于各种原因，有时您需要在线掷骰子，翻转卡片或旋转微调器。该网站适用于诸如此类的简单操作。出于以上原因我做出了一些决定：该网站应尽可能地易于访问任何页面都不得大于 30kB每个工具都应该有一个no javascript 后原创 2021-04-06 21:07:25 · 5504 阅读 · 0 评论 -
2021年50个酷炫的Web和移动项目创意
2021年50个酷炫的Web和移动项目创意当想到项目创意时，很多人都在挣扎。这里列出了20个您可以在2021年完成的很棒的项目构想。我什至将以我的技术栈为例，以便您弄清楚自己也可以做到这一点。这些应用程序可以在Web，移动和桌面上。您可以使用无数种工具，技术和编程语言来构建它们，我仅在此处显示一些用例。每个项目的编程级别均为初学者，中级或高级。这些应用程序可以创建为前端，后端或全栈。所涉及的技术栈是：前端：HTML，CSS，JavaScript，TypeScript，React，React Nati原创 2021-03-29 01:49:33 · 10964 阅读 · 5 评论 -
仅使用HTML和CSS的亮暗模式按钮切换
建立仅html和css的亮暗模式切换的快速指南。文章末尾给出了完整代码演示效果：使用css，html我们将建立一个按钮，该按钮：light-mode和dark-mode之间的变化默认为用户首选的配色方案更改标签以反映用户的首选配色方案。为什么没有JavaScript？我的目标之一是使每个工具都可以不使用javascript，以一定程度上简化代码，同时也是个挑战。我需要一种dark-mode 无需javascript进行切换的方法，同时仍然默认为visitor preferred-col.原创 2021-03-15 21:20:07 · 4022 阅读 · 2 评论 -
让我们使用HTML，CSS和Javascript构建响应式导航栏和面包屑菜单
大家好！在本教程中，我们将使用html，css和一些javascript构建响应式导航栏和面包屑菜单。这就是它的样子，因此，让我们从HTML开始，<header class="header"> <nav class="navbar"> <a href="#" class="nav-logo">WebDev.</a> <ul class="nav-menu"> ..原创 2021-03-14 20:24:25 · 6544 阅读 · 6 评论 -
基于HTML/CSS的响应式俄罗斯套娃ʕ •ᴥ•ʔ小游戏
演示效果：如下所示，您可以看到我创建的演示：一个基于HTML，CSS的响应式俄罗斯套娃ʕ •ᴥ•ʔ小游戏，文章末尾给出了完整的源码截图演示地址http://haiyongcsdn.gitee.io/eluositaowa/项目地址https://gitee.com/haiyongcsdn/eluositaowa代码展示HTML(Pug)mixin bear() svg(viewbox='0 0 300 550' preserveaspectratio='xMinYMin'.原创 2021-03-09 22:26:00 · 7738 阅读 · 3 评论 -
2021年响应式导航菜单️|| CSS JS
2021年响应式导航菜单????️|| CSS JSHTMLSCSSJavaScript最后让我们在2021年从头开始为台式机和移动屏幕构建响应式导航汉堡菜单????️来到Codepen.io或任何代码编辑器，然后将它们写在scss中????// Changing default styles*{ margin: 0px; padding: 0px; box-sizing: border-box; body{ font-family: sans-serif; wi原创 2021-03-08 21:50:44 · 5270 阅读 · 2 评论 -
给大家分享一个基于HTML/CSS/JS酷炫的登陆注册表单
演示效果：在下面，您可以看到我创建的演示：一个基于HTML，CSS，JS的登陆注册表单，文章中给出了完整的源码项目描述在转到实际代码之前，我想对组件中要包含的内容进行分解。这将有所帮助，因为它将使我们编写的代码更加清晰。我们在主要组件（.container）中有4个较小的屏幕/框：在登录形式该会员注册表格在登录覆盖该会员注册覆盖另外，您会在某一时刻看到以下任一情况：在登录形式旁会员注册覆盖该会员注册的形式旁边的登录覆盖在覆盖面板中，我们有一些文本和button—单击以原创 2021-03-07 19:28:40 · 5458 阅读 · 20 评论 -
都2021年了，你不会还没掌握响应式网页设计吧？
初学者如何掌握响应式网页设计知道响应式设计与自适应设计反应灵敏适应性强使用相对单位将设计划分为断点引导响应断点了解最大值和最小值我仍然在努力使网站具有响应能力。我知道初学者可以在网上冲浪（我之前已经这样做过），以使网站具有响应性，但是他们这样得到的只是对小概念的解释。在本文的这篇文章中，我将谈谈有关如何掌握响应式Web设计的所有知识。知道响应式设计与自适应设计反应灵敏网站外观的动态变化。取决于设备的屏幕尺寸和方向。适应性强自适应设计使用一些固定的布局，然后为当前屏幕尺寸选择最佳的布局.原创 2021-02-27 20:51:21 · 8063 阅读 · 4 评论