tag stylus

標籤
貢獻12
9
11:26 AM · Nov 25 ,2025
landyliu 頭像 djz1234 頭像 chauncywu 頭像 element_593929d3ae888 頭像 shipskunkun 頭像 zbh 頭像 alfred_5972f8006661f 頭像 201926 頭像 tingzhong666 頭像 taoqun 頭像 pugongyingxiangyanghua 頭像 fish_head 頭像

@stylus / 博客 RSS 訂閱

landyliu 頭像

前端哇發哈 - 大話css預編譯處理（三）：基礎語法篇

一、Sass、LESS和Stylus的語法 每一種語言都有自己一定的語法規則，CSS預處理器語言也不例外，在真正使用CSS預處器語言之前還有一個不可缺少的知識點，就是對語法的理解。值得慶幸的是，這三款CSS預處理器語言的語法和CSS語法都差不多。 1.Sass語法 Sass3.0版本開始使用的是標準的CSS語法，和SCSS可以説是一樣的。這樣Sass代碼轉換成CSS代碼變得更容易。默認Sass使用

sass , less , stylus , Css , 前端

收藏 評論

djz1234 頭像

大桔子 - css 預處理器 - sass/scss、less、stylus

css 預處理工具，可以將其對應的DSL(領域特定語言)編譯為 css 基本介紹 sass/scss SASS 2007年誕生，最早也是最成熟的CSS預處理器，擁有ruby社區的支持和compass這一最強大的css框架 Sass的縮排語法，對於寫慣css前端的web開發者來説很不直觀，sass 不兼容 css 代碼 Sass3 就變成了Scss(sassy css) 與原來的語法兼容，只

sass , less , stylus , Css , postcss

收藏 評論

chauncywu 頭像

Fw惡龍 - Stylus系列——webpack-spritesmith配合stylus使用示例

原文地址：https://segmentfault.com/a/1190000021487215 作者：Fw惡龍 本文首發於：思否 一、前言 基於Webpack的CSS Sprites實現方案，若是直接在html中調用雪碧圖圖標已經很方便，但是實際開發過程可能遇到需要在偽元素中使用雪碧圖，或者需要hover切換另一個圖標，這種情況下就無法在css中直接調用圖標類名。這時，就需要

stylus , webpack

收藏 評論

element_593929d3ae888 頭像

element - react ^16.8.6 添加 stylus & less ; 配置alias別名 @

前提： 使用 yarn create react-app 創建的項目，yarn add antd 引入 antd 1. yarn run eject 2. yarn add stylus stylus-loader 如果需要 less, 則將此文出現的stylus統統替換為less, 或者追加less, 讓stylus與less同時生效 此時重啓，可能會報錯如下，刪除node_modules, 執

react , stylus

收藏 評論

shipskunkun 頭像

遲不子 - 記錄移動端開發1像素邊框問題， stylus代碼轉成less

需求： 需要解決1像素問題: 物理像素是設備像素的2倍，在手機上預覽，1px邊框會變成2px 參考cube-ui的mixin.styl 中1像素解決方案，如下： border-1px($color = #ccc, $radius = 2PX, $style = solid) position: relative ::after content: "" pointer-ev

less , stylus

收藏 評論

zbh 頭像

webpig - 垃圾分類小程序

垃圾分類，從我做起 最近垃圾分類比較火，各大城市紛紛開始實施垃圾分類制度，提高垃圾的資源價值和經濟價值。但是垃圾分類不好記，然後我自己搗鼓了一款垃圾分類小程序，來幫助大家進行垃圾分類。😄 做小程序的同時自己也學習了一波。 小程序（垃圾的小窩） 該程序實現了文字搜索，圖像識別，查看分類等功能，非常具有實用性。下面貼幾張圖： 暫時就貼這幾張圖了，想要了解更多，可以搜索

stylus , typescript , Javascript

收藏 評論

alfred_5972f8006661f 頭像

前端熟練工 - @import '~common/stylus/mixin'中 ~ 的作用

在vue文件中，要引入相應的樣式，經常會用到 @import "~common/stylus/mixin"這種寫法，為什麼會用到~？查看了stylus-loader文檔，發現這句話 It also lets you load a stylus file from a package installed in node_modules or if you add a modulesDirec

stylus , Css

收藏 評論

201926 頭像

碼廚 - 基於 less,sass,stylus三種預處理rem

一. less形式 //定義一個變量和一個mixin（全局） @fontSizeBase: 75;//基於視覺稿橫屏尺寸/100得出的基準font-size .px2rem(@name, @px){ @{name}: @px / @fontSizeBase * 1rem; } //使用示例： .fontsize {

sass , less , stylus , Css , HTML

收藏 評論

tingzhong666 頭像

tingzhong666 - 一款自動wxss轉換的cli

對小程序進行原生開發時，我不喜歡寫wxss，我喜歡寫stylus。 於是開發了這個命令行工具：wxss-transform 可以將目錄a進行處理，再輸出到目錄b 這裏的處理就是，將stylus和css文件轉換為wxss 並且啓動後，會一直監聽a目錄 項目地址：https://github.com/tingzhong6... 安裝 npm i -D|-g wxss-transform 使用 npx

node.js , stylus , Css , Javascript

收藏 評論

taoqun 頭像

Taoqun - jquery開發 css 自動刷新預覽 stylus編譯

今天需要做一個簡單的介紹展示頁面，無需webpack這類的腳手架，裝了兩個包就能開始開發了。 環境需求： 自動刷新 編譯css 使用兩個包就可以了： browsersync 監聽變動 自動刷新頁面 stylus 寫css一直比較喜歡這個css預處理框架，因為簡潔 安裝browsersync 安裝 npm install -g browser-sync 監聽文件 browse

node.js , stylus , jquery , html5 , Javascript

收藏 評論

pugongyingxiangyanghua 頭像

蒲公英想養花 - 自定義組件（原創）——組合Ccombine

本組件中使用到了iview的Icon，可以在全局安裝了Iview的項目或者局部引入了Icon的頁面中自由使用。 目錄 效果展示 功能描述 結構代碼 邏輯代碼 組件應用 事件鈎子 github 效果展示 從左到右分別是：未選中狀態、鼠標懸浮、選中、添加組合按鈕 功能描述 添加/刪除組合 單擊聚焦組合 雙擊修改組合名字 切換下一個組合或者新增組合時上一個

組件設計 , vue.js , stylus , iview , 前端

收藏 評論

landyliu 頭像

前端哇發哈 - 大話css預編譯處理（二）安裝使用篇

一、Sass、LESS和Stylus的安裝 1.Sass的安裝 Sass是Ruby語言寫的，但是兩者的語法沒有關係。不懂Ruby，照樣可以正常使用Sass。只是必須先安裝Ruby，然後再安裝Sass。首先安裝Ruby，如果你使用的是IOS系統，那麼你的系統已經安裝好了Ruby。如果你使用的是微軟的Windows系統，那麼安裝就有些許的麻煩。不過也不用過於擔心，按照下面的步驟就能幫你快速的安裝好。

sass , less , stylus , Css , 前端

收藏 評論

fish_head 頭像

陳大魚頭 - CSS的未來已來

作者：陳大魚頭 github： KRISACHAN 前言 最近聽説TypeScript3.7添加了對Optional Chaining的支持，然後就想着給魚頭的腳手架ying-template的TS版本升級，然後在命令行發現這樣的一句信息： 'postcss-cssnext' 已經被 'postcss-preset-env'代替了。詳情請查看 https://moox.io/b

sass , less , stylus , Css , postcss

收藏 評論

landyliu 頭像

前端哇發哈 - 大話css預編譯處理（一）通讀介紹篇

一、什麼是css預編譯處理？ CSS 預編譯處理，從字面上理解，就是預先編譯處理CSS。它擴展了 CSS 語言，增加了變量、Mixin、函數等編程的特性，使 CSS 更易維護和擴展。CSS預編譯的工作原理是提供便捷的語法和特性供開發者編寫源代碼，隨後經過專門的編譯工具將源碼轉化為CSS語法。 CSS預編譯器幾乎成為現如今開發CSS的標配，它從以下幾個方面提升了CSS開發的效率： 增強編程

sass , less , stylus , Css , 前端

收藏 評論