tag Css

標籤
貢獻785
967
06:37 AM · Oct 27 ,2025
vitaly-friedman 頭像 u_15469972 頭像 nanchengfe 頭像 louis-lazaris 頭像 temani-afif 頭像 u_16164933 頭像 u_17534189 頭像 u_17569005 頭像 adrian-bece 頭像 andy-clarke 頭像 u_13934709 頭像 brecht-de-ruyte 頭像

@Css / 博客 RSS 訂閱

linyuyizhizou_678b9fdc436f1 頭像

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

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

css3 , Css , 前端

收藏 評論

shuirongshui 頭像

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

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

Css , Javascript

收藏 評論

caigaobadoudehuangdou_depjnr 頭像

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

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

Css , Javascript

收藏 評論

linyuyizhizou_678b9fdc436f1 頭像

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

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

css3 , Css , 前端

收藏 評論

shuirongshui 頭像

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

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

react , jquery插件 , Css , jquery , HTML

收藏 評論

linyuyizhizou_678b9fdc436f1 頭像

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

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

css3 , Css , 前端

收藏 評論

_6901c0fb92647 頭像

蒳某泥 - 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

收藏 評論

linzai_6904290569daa 頭像

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

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

Css , 前端 , Javascript

收藏 評論

zhuifengdekukafei 頭像

追風的苦咖啡 - 等保 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

收藏 評論

zhuifengdekukafei 頭像

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

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

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

收藏 評論

software-Development 頭像

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

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

Css , HTML , 前端 , Web

收藏 評論

software-Development 頭像

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

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

Css , HTML , 前端 , Web

收藏 評論

smileZAZ 頭像

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

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

Css , HTML , 前端 , Web

收藏 評論

smileZAZ 頭像

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

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

Css , HTML , 前端 , Web

收藏 評論

smileZAZ 頭像

林恆 - 記錄---啊！！！Blob 居然這麼強大！

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 啊！！！Blob 居然這麼強大！ 在前端開發的世界裏，我們每天都在和各種 API、對象和數據打交道。然而，有一個對象，常常被我們忽視，卻又在背後默默支撐着許多關鍵功能 —— 它就是 Blob。 Blob（Binary Large Object）聽起來像是一個“冷門”對象，但實際上，它幾乎無處不在：文件上傳、下載、視頻

Css , HTML , 前端 , Web

收藏 評論

smileZAZ 頭像

林恆 - 記錄---瀏覽器指紋-探究前端如何識別用户設備

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 什麼是瀏覽器指紋？ 瀏覽器指紋，是用來唯一標識你瀏覽器的一組“特徵值”。它不是我們理解中的那種真實指紋，而是通過收集瀏覽器、操作系統、設備分辨率、字體、插件等信息，組合成的一個獨特 ID。 和傳統的 Cookie 不同，瀏覽器指紋不需要在用户設備上存儲任何東西，完全是“讀取現有信息”來識別用户。 使用背景 在最近的項目

Css , HTML , 前端 , Web

收藏 評論

wdllmh 頭像

wdllmh - 上下margin無法生效的一種情況-行內元素

問題描述 在學udemy的htmlcss課的時候，challenge2有一部分是給超鏈接添加margin-top/bottom,添加後瀏覽器devtool的樣式中顯示margin已生效，但是在頁面中卻無法顯示。 解決過程 搜索margin不生效的幾個原因可以總結為 parent box 放不下 上下相鄰的塊產生margin摺疊 但是前者一般對parent中頭尾的child產生影

Css , HTML , 前端 , Web

收藏 評論

smileZAZ 頭像

林恆 - 記錄---基於uniapp，編寫一個自定義的日期組件

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 環境配置 系統：windows10 平台：HBuilderX4.76 語言：vue、javascript 庫：uni 概述 本文是基於uniapp，編寫的自定義日期選擇器組件，大致效果如下： 1、組件簡介 這是一個日期選擇器，即可以選擇年、月、日的組件，所以，組件的功能是很簡單的，組件的效果就是如上面的效果圖所

Css , HTML , 前端 , Web

收藏 評論

smileZAZ 頭像

林恆 - 記錄---前端微服務框架深度對比：無界（Momentum）與乾坤（Qiankun）實戰指南

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 一、引言：為何選擇微前端？ 在傳統單體前端架構中，隨着業務複雜度增加，代碼臃腫、協作困難、部署效率低等問題愈發突出。微前端通過將項目拆分為多個獨立自治的微應用，解決了這些問題： 技術棧無關：支持 Vue、React、Angular 等框架混合開發 獨立部署：各團隊可獨立開發、測試、發佈 漸進升級：允許逐步重構舊系統 動態加載

Css , HTML , 前端 , Web

收藏 評論

smileZAZ 頭像

林恆 - 記錄---window.close()失效 + Chrome瀏覽器調試線上代碼

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 情況説明 主系統單點登錄點擊觸發window.open()打開本系統。 是發佈生產後的新需求：要求退出登錄後直接關閉當前系統頁面。 本地運行增加了window.close()方法實現功能，點擊退出後頁面沒反應。 排查過程 官方解析中説明，window.close() 方法只能關閉由window.open()或者瀏覽器直接輸入

Css , HTML , 前端 , Web

收藏 評論

tangge 頭像

【唐】三三 - Scss 基礎

scss 轉 css 在線轉換 https://33tool.com/scss_to_css/ 變量 $primary-color: #000; .main1 { background-color: $primary-color; } 一、嵌套 1.1 父選擇器 (Referencing Parent Selectors: ) 在嵌套 CSS 規則時，有時也需要直接使用嵌套外層的父選

Css , HTML , 前端 , Web

收藏 評論

tangge 頭像

【唐】三三 - CSS - transition 粗淺記憶

在 CSS 中，transition 是用於實現元素樣式平滑過渡的屬性，能讓元素從一種樣式狀態（如顏色、尺寸、位置等）逐漸變化到另一種狀態，避免樣式突變帶來的生硬感。它是實現基礎動畫效果的核心工具，廣泛用於 hover 交互、狀態切換等場景。 一、transition 核心語法 transition 是一個複合屬性，可以同時定義過渡的多個參數，語法如下： css transition: [過渡屬性

Css , HTML , 前端 , Web

收藏 評論

smileZAZ 頭像

林恆 - 記錄---圖文並茂講解nginx中http升級https（部署SSL證書）知識點總結

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 為何網站要升級為https 原因有以下幾點: 1. 避免瀏覽器的不安全的警告 瀏覽器對於http的網站會在地址欄明確標記【不安全】字樣 這樣直接降低用户對網站的信任度 造成用户流失 甚至可能被用户誤認為是釣魚網站 如下圖，是筆者的網站沒有升級https證書的時候的樣子 升級後的 2. 加密傳輸數據，防止數據泄露

Css , HTML , 前端 , Web

收藏 評論

aarongustafson 頭像

Aaron Gustafson - Developing Dependency Awareness

I’m sure you’ve heard the proverb, “A chain is only as strong as its weakest link,” probably many times. Its written origin dates back to the 18th century, but I wouldn’t be surprised if it was much

coding , Css , jquery , Javascript

收藏 評論