前段

推薦2個網友自辦的網絡周刊 – 科技愛好者周刊 / 潮流周刊

科技愛好者周刊 內容科技相關,作者阮一峰 (Twitter @ruanyf)。每周精選一張圖片。「本周話題」應該為作者原創寫作內容。比如231期,討論了Twitter裁員,其中用了Twitter用戶數和員工數隨着時間變化曲線,發現2014年後用戶數量基本穩定在3億左右,而員工數確翻了一倍左右,所以把員工數減少回2014年的人數應該是可以的。 另外收集了不少科技相關的網絡內容並提供鏈接。比如231期介紹了63歲日本退休工程師Hiroyuki Ueda自學Swift,開發了「雙重計算器」(Twin Cal)App。主要解決人腦記不住計算中間結果的問題。在AppStore看了一下,Twin-Calc賣3.99,同時有個免費版的T-Calc-Lite。 更多內容請看科技愛好者周刊。 潮流周刊 作者Tw93 (Twitter @HiTw93)。頁面設計非常小清新。和科技愛好者周刊類似每期內容有:封面故事,技術相關,潮流開源,隨便看看。105期里介紹的HyperUI.dev就非常好用,裏面有很多例子用tailwind做出好看的Web UI元素的例子。 周刊鏈接 科技愛好者周刊 潮流周刊 本文鏈接

CSS 格子layout例子

1 2 3 4 5 6 7 CSS代碼 HTML代碼 padding是div內部內容和div格子上下左右邊界的距離 display: grid 決定了內部div (“inner” class)從左到右排練,如果不用,每個div各佔一行 grid-template-columns 決定了一行放幾個內部div,和每個內部div寬度,可以是%也可以絕對距離 boarder用來debug,顯示格子邊界大小 用鼠標選中格子里兩行,cmd+c,cmd+v 複製黏貼到編輯器里,出了還是一個一行,打橫顯示是瀏覽器的特效。