tag Css

標籤
貢獻771
723
06:37 AM · Oct 27 ,2025

@Css / 博客 RSS 訂閱

兔子先森 - 《vue.js設計與實現》——過期的副作用

我們平時可能不太關注"競態"的問題,但是你在日常的工作中可能或多少遇到過"競態" let finalData; watch(obj, async () = { // 發送一個請求 let res = await fetch('/api/request'); // 將數據保存到finalData finalData = res; }) 這段代碼看起來沒問題,實際上會發

vue.js , Css , HTML , 前端 , Javascript

收藏 評論

水冗水孚 - 從一個動畫需求,來學習js中animation動畫事件的具體應用

本文通過一個具體的動畫需求,來講解一下js中animationend事件使用 在線演示效果一:https://ashuai.site/reactExamples/animationEvent 在線演示效果二:https://ashuai.work:8890/27 前言 平常,我們代碼中,會做一些事件的監聽 比如點擊事件、右鍵事件、滾動事件等 實際上,js中還提供了動畫事件的相關ap

animation , dom , Css , Javascript

收藏 評論

前端視界 - 一步步教你用 CSS Grid 實現靈活又高效的瀑布流佈局,適配所有屏幕!

摘要 隨着網頁設計越來越複雜,尤其是圖片牆、商品展示、內容卡片這類頁面,瀑布流佈局(也叫 Masonry 佈局)成了非常受歡迎的設計方案。傳統實現往往依賴大量 JavaScript 或第三方庫,但其實利用 CSS Grid 加上少量 JS,就能實現既響應式又性能優越的瀑布流佈局。 本文將深入拆解這種方法的原理,帶你一步步理解關鍵代碼的作用,配合可運行的示例,讓你能輕鬆上手並靈活應用到實際項目中。

Css , HTML

收藏 評論

藍易雲 - python telnetlib詳解

Python telnetlib 詳解(含 3.13 之後的替代方案) 適用讀者:需要在受控內網/實驗環境使用 Telnet 的同學。生產環境強烈建議優先 SSH(如 Paramiko/Netmiko)。 版本事實:telnetlib 在 span style="color:red"Python 3.11 標記棄用/span,並已在 span style="color:red"Pytho

css3 , Css , HTML , html5 , Javascript

收藏 評論

下一個絕世 - 免費的 CRM 軟件哪個好用

免費的CRM軟件哪個好用?免費CRM軟件是中小企業和初創公司提升銷售效率、優化客户管理的理想選擇。在眾多免費的CRM軟件中,Zoho CRM憑藉其全面的功能、易用性和高性價比,成為最值得推薦的選擇。 一、什麼是CRM軟件? CRM軟件是一種幫助企業管理銷售流程、客户關係和銷售團隊的工具。它可以幫助銷售人員更高效地跟蹤銷售線索、管理客户信息、制定銷售計劃,並通過數據分析優化銷售策略。 CRM軟件的核

Css , chrome-devtools

收藏 評論

逆風微笑的代碼狗 - 將 Tailwind CSS 添加到靜態站點

如何將 Tailwind CSS 添加到靜態站點? 初始化 Tailwind 首先,需要一個最新版本的 Node。使用 $ node -v 全局安裝npx有助於遵循官方説明。這是一個運行 Node 包可執行文件的工具,如果文件缺失,它會獲取它們。獲取方法如下: $ npm install -g npx 以下是 Tailwind CLI 的命令: npm install -D tailwindcss

tailwind-css , Css

收藏 評論

你好啊你好 - 摩天輪(vue)

效果圖 使用示例 script lang="ts" setup import FerrisWheel from "**/FerrisWheel.vue"; import { ref } from "vue"; const defaultUrls = [ "https://naive-ui.oss-cn-beijing.aliyuncs.com/carousel-img/carousel1.

vue.js , Css , HTML , 前端 , Javascript

收藏 評論

衍生星球 - JSP 程序設計之 Web 技術基礎

在 Java Web 開發的世界裏,JSP(Java Server Pages)是一門舉足輕重的動態網頁開發技術。要學好 JSP,首先得紮實掌握 Web 技術基礎,下面就帶大家深入瞭解相關知識。 Web 的起源與發展 Web,本意是蜘蛛網和網,在網頁設計中特指網頁。它誕生於 1989 年 3 月,由歐洲粒子物理研究所的科學家蒂姆・伯納斯・李發明。1990 年 11 月,第一個 Web 服務器正式運

jsp , Css , HTML , Javascript , Web

收藏 評論

不可能的是 - 深度解析:Sass-loader Legacy API 警告的前世今生與完美解決方案

📖 文章概述 當你在前端項目中看到 Deprecation Warning [legacy-js-api]: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0 這個警告時,是否感到困惑?本文將帶你深入探索這個警告背後的技術原理,從源碼層面分析調用鏈路,對比不同版本的功能差異,並提供多種實用的解決方案。 你

css3 , Css , typescript , 前端 , Javascript

收藏 評論

你好啊你好 - div + transform 實現旋轉圖片並得到期望的佔位盒子

效果圖 使用示例 script setup lang="ts" import RotatedImage from "**/RotatedImage.vue"; import { ref } from "vue"; const value = ref(50); const clockwise = ref(true); const src = ref( "https://naive-ui.os

vue.js , Css , HTML , 前端 , Javascript

收藏 評論

小帆聊前端 - Flex 佈局實戰指南:從踩坑到精通,解決 90% 佈局難題

前言:你是否也被這些 Flex 問題折磨過? “為什麼我用justify-content: center卻無法垂直居中?” “align-items和align-content到底什麼時候生效?” “設置了width: 200px,加了flex:1後怎麼沒用了?” 作為前端開發最常用的佈局方案,Flex(彈性佈局)以 “靈活” 著稱,但這份靈活也讓很多開發者陷入 “混亂”—— 核心原因是沒吃透 “

css3 , Css , 前端

收藏 評論

水冗水孚 - 每天進步一點點——學習高度過渡的四種方式

每天學點知識點,每天進步一點點,本文記錄了高度過渡變化的四種方式,大家一塊來查漏補缺,或者回顧知識吧😉😉😉 常見的四種方式的高度過渡 目前常見的高度過渡的方式有四種 transition + height transition + max-height transition + tranform:scale(0/1) JS方式計算元素的高度 實際上,還有一個height: c

Css , Javascript

收藏 評論

才高八斗的黃豆_depjNR - jQuery的常用方法與返回值分析

使用jQuery的常用方法與返回值分析 jQuery是一個輕量級的JavaScript庫,旨在簡化HTML文檔遍歷和操作、事件處理以及動畫效果的創建。本文將介紹一些常用的jQuery方法及其返回值,幫助開發者更好地理解和運用這一強大的庫。 選擇器方法 jQuery提供了多種選擇器,可以快速獲取DOM元素。最基本的選擇器是$(),例如: var elements = $('.className

Css , Javascript

收藏 評論

小帆聊前端 - CSS BFC 深度解讀:從原理到實戰,解決 90% 佈局難題

CSS BFC 深度解讀:從原理到實戰,解決 90% 佈局難題 前言:被 “玄學佈局” 折磨的日常 “為什麼兩個相鄰 div 的 margin 疊成一個了?” “浮動元素怎麼把父容器‘撐破’了?” “文字怎麼總繞着浮動圖片跑,我想讓它老老實實換行!” “子元素用了絕對定位,怎麼就超出父容器範圍了?” 如果你在前端開發中遇到過這些問題,説明你還沒真正掌握 BFC—— 這個 CSS 中 “看不見卻很重

css3 , Css , 前端

收藏 評論

水冗水孚 - React中使用map+area標籤實現img圖片特定區域標記功能(可用Photoshop精準拾取對應點位)

需求描述 前段時間,工作中筆者接到了一個有意思的需求 就是給圖片做特定的交互效果 圖片中有幾個特殊區域 當用户hover特殊區域的時候,高亮 點擊特殊區域的時候,彈框給到一些提示信息 效果圖和線上演示 線上效果演示地址:https://ashuai.site/reactExamples/imagePoint 技術方案選擇 這個需求如果圖片中的特定區域都是矩形 我們完全可以直接

react , jquery插件 , Css , jquery , HTML

收藏 評論

小帆聊前端 - CSS 選擇器全解析:從基礎語法到組件庫樣式修改,解決前端樣式定位難題

前言:被 CSS 選擇器 “卡殼” 的日常 “寫了.btn-active樣式,為什麼按鈕沒反應?” “#nav .list li和.nav-list li到底誰能生效?” “想改組件庫的輸入框樣式,加了類卻被覆蓋?” “用[class=btn]匹配按鈕,多了個類名就失效了?” CSS 選擇器是前端樣式的 “定位工具”,但很多開發者停留在 “會用類和 ID” 的初級階段,面對動態元素、組件庫樣式修改

css3 , Css , 前端

收藏 評論

蒳某泥 - css實現盒子重複放大縮小

div class=box1/div .box1{ width:100px; height:100px; margin:auto; animation:myMove .5s infinite alternate linear; -moz-animation:myMove .5s infinite alternate linear; -webkit

Css

收藏 評論

臨在 - 用JavaScript製作動態表白頁面

前言 最近在抖音上刷到這種文字表白特效,覺得挺有意思的,就想着自己也能用代碼實現一個,雖然實現得比較基礎,但效果還挺像那麼回事!分享出來給大家參考,也期待大佬們給出更好的實現方案~ 實現效果: 在屏幕內隨機出現div盒子,位置隨機,內容隨機選,要求動態的一個個淺出 css部分 div { width: 200px; height: 100px; text-align: c

Css , 前端 , Javascript

收藏 評論

追風的苦咖啡 - 等保 2.0 測評必看:免費 SSL 證書能過密評嗎?國密算法是關鍵

在等保 2.0 測評中,免費 SSL 證書能否通過密評(密碼應用安全性評估)取決於其是否支持國密算法(SM2/SM3/SM4)及合規性認證。以下是關鍵分析與解決方案: SSL證書入口⬇️ https://www.joyssl.com/certificate/select/free.html?nid=59 一、等保 2.0 對 SSL 證書的核心要求 密碼算法合規性 等

教程 , postgresql , memcached , Css

收藏 評論

追風的苦咖啡 - SM2 vs RSA/ECC:雙算法 SSL 證書的性能對比與優化方案

SM2 vs RSA/ECC:雙算法 SSL 證書的性能對比與優化方案 雙算法 SSL 證書(如同時支持 SM2 與 RSA/ECC)的核心價值在於平衡合規性(如國內政務、金融場景的國密要求)與國際兼容性(歐美市場依賴 RSA/ECC),但兩種算法的底層數學原理差異會直接影響性能表現。本文從實測數據出發,對比 SM2、RSA、ECC 的性能差異,並針對雙算法部署的瓶頸提供可落地的優化方案。 雙算法

微服務 , 教程 , Linux , Css , sublime-text

收藏 評論

IT開發者筆記 - 藉助Aspose.HTML控件,使用 Python 編程將網頁轉換為 PDF

使用 Python 將網頁轉換為 PDF 有時您需要離線訪問網頁,使其更易於訪問。因此,將HTML頁面轉換為PDF即可滿足您的需求。令人驚訝的是,您可以在幾秒鐘內在 Python 項目中啓用 HTML 到 PDF 的轉換。本指南將為 Python 開發人員介紹一個功能強大的 SDK——Aspose.HTMLfor Python via .NET,它提供了一系列用於將網頁轉換為不同文件格式的類和方

Css , HTML , 前端 , Web

收藏 評論

IT開發者筆記 - 藉助Aspose.HTML控件,在 Python 中將 HTML 轉換為 Markdown

在這個人工智能時代,Markdown因其易用性而備受重視。這種標記語言易於人類和機器理解。此外,與 HTML 和 DOCX 相比,這種格式更有助於法學碩士 (LLM) 理解文檔結構。因此,本指南將介紹如何以 Python 編程方式將HTML轉換為 Markdown。我們將使用Aspose.HTML for Python via .NET,因為它易於在 Python 項目中設置。這款 Python

Css , HTML , 前端 , Web

收藏 評論

林恆 - 記錄---npm link 詳解:本地包開發與測試的利器

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 npm link 詳解:本地包開發與測試的利器 什麼是 npm link? npm link 是 npm 提供的一個強大功能,它允許你在本地開發環境中創建符號鏈接,將本地開發的包鏈接到其他項目中進行測試和使用。這個功能特別適合在開發自己的 npm 包時進行本地調試和測試。 核心概念 符號鏈接(Symbolic

Css , HTML , 前端 , Web

收藏 評論

林恆 - 記錄---從零開始編寫 useWindowSize Hook

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 在 React 開發中,我們經常需要根據窗口大小來調整組件的行為。今天我們將從最簡單的實現開始,逐步優化,最終構建出一個高性能的useWindowSizeHook。 第一步:最簡單的實現 讓我們從最基礎的版本開始: import { useState, useEffect } from 'react' function useW

Css , HTML , 前端 , Web

收藏 評論