2012年3月14日 星期三

【CSS教學】CSS的層疊

http://gordon168.tw/?p=290

CSS Reset 的另一種選擇-Normalize CSS

一般在網頁設計時,都會使用 CSS Reset 來清除各種瀏覽器的預設樣式,接著再設定想要的樣式時就會排除掉很多在不同瀏覽器上詭異的情況。
而現在,除了以往常見 Eric Meyer 版本YUI 版本的 CSS Reset 之外,還有另一種選擇-Normalize CSS
Normalize CSS 和 CSS Reset 最大的不同在於,CSS Reset 是清除所有預設的樣式;而 Normalize CSS 則是賦予各種 HTML 元素一個預設的樣式,譬如 <h1><h2><h3> 等標題字型大小、<ul> 的預設該有的 padding 等等。也增加了一些可用性(如在 <button> 元素上游標會變成手指狀,告訴使用者可以按)。有了這些預設的樣式,在寫我們自己的 CSS 時,可以減少許多屬性設定。
另外 Normalize CSS 是針對 HTML5 的 CSS 框架,所以支援 HTML5 中新的標籤,包括 video、canvas 等等。如果要做 HTML5 的網頁的話,會非常方便。Normalize CSS 的專案頁面上提供了一個Demo 的網頁。可以看看各種元素經過 Normalize CSS 標準化之後的模樣。

設計|常用的CSS命名規則 (web標準化設計)

常用的CSS命名規則 (web標準化設計)
(一)常用的CSS命名規則
頭:header
內容:content/container
尾:footer
導航:nav
側欄:sidebar
欄目:column
頁面週邊控制整體佈局寬度:wrapper
左右中:left right center
登錄條:loginbar
  
標誌:logo
廣告:banner
頁面主體:main
熱點:hot
新聞:news
下載:download
子導航:subnav
菜單:menu
子功能表:submenu
 
搜索:search
友情連結:friendlink
頁腳:footer
版權:copyright
滾動:scroll
內容:content
標籤頁:tab
文章列表:list
提示資訊:msg
  
小技巧:tips
欄目標題:title
加入:joinus
指南:guild
服務:service
註冊:regsiter
狀態:status
投票:vote
合作夥伴:partner
(二)注釋的寫法:
/* Footer */
內容區
/* End Footer */ 
(三)id的命名:
(1)頁面結構
容器: container
頁頭:header
內容:content/container
頁面主體:main
頁尾:footer
導航:nav
側欄:sidebar
欄目:column
頁面週邊控制整體佈局寬度:wrapper
左右中:left right center 
(2)導航
導航:nav
主導航:mainbav
子導航:subnav
頂導航:topnav
邊導航:sidebar
左導航:leftsidebar
右導航:rightsidebar
菜單:menu
子功能表:submenu
標題: title
摘要: summary 
(3)功能
標誌:logo
廣告:banner
登陸:login
登錄條:loginbar
註冊:regsiter
搜索:search
功能區:shop
標題:title
加入:joinus
狀態:status
按鈕:btn
滾動:scroll
標籤頁:tab
文章列表:list
提示資訊:msg
當前的: current
小技巧:tips
圖示: icon
注釋:note
指南:guild
服務:service
熱點:hot
新聞:news
下載:download
投票:vote
合作夥伴:partner
友情連結:link
版權:copyright 
(四)class的命名:
(1)顏色:使用顏色的名稱或者16進制代碼,如
.red { color: red; }
.f60 { color: #f60; }
.ff8600 { color: #ff8600; } 
(2)字體大小,直接使用"font+字體大小"作為名稱,如
.font12px { font-size: 12px; }
.font9pt {font-size: 9pt; } 
(3)對齊樣式,使用對齊目標的英文名稱,如
.left { float:left; }
.bottom { float:bottom; }
  
(4)標題列樣式,使用"類別+功能"的方式命名,如
.barnews { }
.barproduct { }

注意事項:
1.一律小寫;
2.儘量用英文;
3.不加中杠和底線;
4.儘量不縮寫,除非一看就明白的單詞.
主要的 master.css
模組 module.css
基本共用 base.css
佈局,版面 layout.css
主題 themes.css
專欄 columns.css
文字 font.css
表單 forms.css
補丁 mend.css
列印 print.css 

Great Showcase of Paper Inspired Website Designs | Modny73

http://www.modny73.com/inspiration/great-showcase-of-paper-inspired-website-designs/
Great Showcase of Paper Inspired Website Designs | Modny73





如何在 ASP.NET C# 取得<input type="text"..... 內的value值 http://www.blueshop.com.tw/board/show.asp?subcde=BRD200803191237599YR

asp.net 前台绑定后台变量方法总结

2012年3月13日 星期二

[無痛上手]附原始碼+多檔上傳+顯示%數

http://www.blueshop.com.tw/download/show.asp?pgmcde=PGM20091029204050OBR&extcde=PGMLSTCAT

最新版本 http://www.blueshop.com.tw/download/show.asp?pgmcde=PGM20100513124137M2M&extcde=PGMLST

前言:

我自認我做的這個使用容易,我不喜歡很繁瑣的設定,所以我整合成元件的方式,以拖曳的方式建立檔案管理,沒有後台程式卻能管理資料夾並授予存取權限。我強調的是 簡單 好用。

Uploadify is available under the GPL and MIT licenses.


說明:

使用技術 Uploadify、 JQuery、 ASP.NET、 C# 、MS Access資料庫

Uploadify 是 支援強大的上傳介面
http://www.uploadify.com/demo/ Uploadify

額外推薦使用 Silverlight/MultiFileUploader
http://www.michielpost.nl/Silverlight/MultiFileUploader/

而我只是將它整合到 ASP.NET 平台上 。

特色:

0.多個檔案上傳,並且有顯示%數進度。

1.可設定上傳下載權限,卻無後台。

2.可以為任何Object準備虛擬檔案管理資料夾(只要有Guid的話)。
(若沒有Guid的話就類似傳統的檔案管理)

3.你不會看到傳統雜亂的資料夾檔案管理,當你有上百個檔案的時候。

4.你可以搜尋你想要的檔案型態,比方說結取在此資料夾中的所有圖檔。

5.不管你是不是有學過ASP.NET 和C#語言,內附範例,照著使用說明文件上的步驟做,就能完成檔案管理系統。

6. 完整公開程式碼!!

結論:

視情況需求我會考慮釋放整合的原始碼。各位看官我表達能力不好,而且等級也不高,但是我自認我沒有比較差(大概),希望你們能試試看。如果有你覺得需要改的,請你回應。


http://www.blueshop.com.tw/download/showdw.asp?pgmcde=PGM20091029204050OBR&filcde=PGM20091124083918SZ0

http://www.blueshop.com.tw/download/showdw.asp?pgmcde=PGM20091029204050OBR&filcde=PGM20091030084111R0C