Skip to content

Zeroplex 生活隨筆

軟體開發、伺服器和生活瑣事

小 縮小字型大小。 中 重設字型大小。 大 放大字型大小。

標籤: CSS

CSS3 Background Future

Posted on 2012 年 2 月 14 日2021 年 3 月 12 日 By 日落 在〈CSS3 Background Future〉中尚無留言

在 JaceJu 的噗浪上看到 CSS3 background 新的特性,可以讓瀏覽器控制背景圖片的一些屬性,頗好用的。

CSS3 Backgrounds of the Future
http://www.andismith.com/blog/2012/02/css-backgrounds-of-the-future/

設定背景圖片:

body {
   backgroud: bg.jpg;  /* 1024x768 */
}

以上的設定,當視窗大小如你預期相同時,畫面便會與最初的設計相同,但若視窗較大或較小,都可能會讓畫面走樣。

加上 background-size 屬性,讓瀏覽器決定圖片的大小:

body {
   backgroud: bg.jpg;
   background-size: contain; 
}

修改之後,背景圖片便會依照視窗大小做調整。

Tags:CSS, 網頁設計

轉貼:開元中最好的 web 開發資源

Posted on 2011 年 6 月 11 日2021 年 3 月 12 日 By 日落 在〈轉貼:開元中最好的 web 開發資源〉中尚無留言

CoolShell.cn 網站上整理了不少網頁開發相關資源,包括:

  • 學習 HTML5 編成與設計
  • Server 端工具
  • PHP Framework 與工具
  • 資料庫
  • API 與即時資訊處理 (在線數據)
  • 線上軟體開發與媒體工具
  • 程式資源與版本管理工具
  • JavaScript Framework
  • JavaScript 移動與觸摸相關 framework
  • jQuery 外掛與相關資源
  • HTML5 視訊播放器
  • JavaScript 音訊處理與視覺化工具
  • JavaScript 2D、3D 圖形
  • JavaScript 與 HTML5 API (接口?)
  • 其他 JavaScript 工具
  • Client 端工具
  • CSS3 與字型資料
  • 網站樣板
忘了貼網址 XD

开源中最好的Web开发的资源

http://coolshell.cn/articles/4795.html
Tags:Apache, CSS, HTML, JavaScript, MySQL, PHP, 網路架站

幾個 CSS3 排版用語法

Posted on 2010 年 7 月 12 日2021 年 3 月 12 日 By 日落 在〈幾個 CSS3 排版用語法〉中尚無留言

在 維基百科:互助客棧/技術/存檔/2010年5月 上面挖到寶,找到幾個 CSS 語法可以讓過長的列表自動分欄。

-moz-column-count: 3;
-webkit-column-count: 3;
column-count: 3;
-moz-column-width: auto;
-webkit-column-width: auto;
column-width: auto;
-moz-column-gap: 0;
-webkit-column-gap: 0;
column-gap: 0;
-moz-column-rule: ;
-webkit-column-rule: ;
column-rule: ;

效果如下:

  • A
  • B
  • C
  • D
  • E
  • F
  • G
  • H
  • I

看不到效果可能是因為使用 IE 的關係,目前 Firefox 和 Chromium 都有支援這個語法,Opera 和 Safari 我就不太確定了。

如果還在使用 IE,請容我說一句話:使用 IE 的死亡率比新流感更高!請改用免費又安全的 Firefox 或是其他瀏覽器!

Tags:CSS, 網路架站

CSS 版面設計樣板範例

Posted on 2010 年 1 月 16 日2021 年 3 月 12 日 By 日落 在〈CSS 版面設計樣板範例〉中尚無留言

最近要生一個網頁樣板出來,不過沒碰過 CSS 單單調整幾個區塊也讓我想撞牆,後來阿雷固推薦我一個網站很不錯,把常用的樣板整理出來,將 CSS 複製貼上就可以使用了。

網站名稱:Little Boxes
http://www.thenoodleincident.com/tutorials/box_lesson/boxes.html

Tags:CSS, 分享, 網路架站

其他

關於我  (About me)

小額贊助

  文章 RSS Feed

  留言 RSS Feed

Apache AWS Bash C/C++ Docker FreeBSD GCP Git Google Java JavaScript Laravel Linux Microsoft MSSQL MySQL Nginx PHP PHPUnit PostgreSQL Python Qt Ubuntu Unix Vim Web Windows WordPress XD 作業系統 分享 好站推薦 專題 攝影 新奇搞笑 新聞 旅遊 生活雜記 程式設計 網路架站 網頁設計 資訊學習 資訊安全 遊戲 音樂


創用 CC 授權條款
本著作係採用創用 CC 姓名標示-相同方式分享 4.0 國際 授權條款授權.