前端冷知識,你可能不知道的前端知識之CSS篇

2021-09-17 01:14:41 字數 551 閱讀 7512

實時編輯css

通過設定style標籤的display:block樣式可以讓頁面的style標籤顯示出來,並且加上contenteditable屬性後可以讓樣式成為可編輯狀態,更改後的樣式效果也是實時更新呈現的。此技巧在ie下無效。大家不妨演示一下!

多重邊框 利用重複指定box-shadow來達到多個邊框的效果

/css border with box-shadow example/

div

效果如下:

enter image description here

css中也可以做簡單運算

通過css中的calc方法可以進行一些簡單的運算,從而達到動態指定元素樣式的目的。

.container

簡單的文字模糊效果

以下兩行簡單的css3**可達到將文字模糊化處理的目的,出來的效果有點像使用ps的濾鏡!

p 學習程式設計最重要的是**敲錯能夠有個人給你指點

所以特意建立乙個web前端開發學習群

群號 569146385直達學習群

領取群裡大咖每日分享和web前端學習資料

10個你可能不知道的前端PS技巧

ps是各位前端開發者的基礎技能,高效利用ps不僅能提高工作效率,更能帶來身心上的愉悅 jack ma 這裡的面板指的是在頂部主選單 視窗 下可開啟的視窗。最常用的幾個視窗必屬 屬性 資訊 圖層 螢幕夠大的同學建議把它們都展開在介面右邊。那為什麼說這幾個面板很常用呢?下面會慢慢介紹到。在移動工具 v ...

你可能不知道的東西

元素可以分為塊級元素,行內元素以及行內塊級元素。行內元素的margin或者padding只有margin left和margin right以及padding left和padding right有效果,margin top margin bottom padding top padding bot...

你可能不知道的const

眾所周知,使用 const 宣告的變數必須同時初始化為某個值。一經宣告,在其生命週期的任何時候都不能再重新賦予新值 const a syntaxerror 常量宣告時沒有初始化 const b 3 console.log b 3 b 4 typeerror 給常量賦值const 宣告只應用到頂級原語...