2010/05/30

不錯的網頁技術教學網站 OECSpace

http://www.hsiu28.net/main/

在網頁中引入外部css樣式表時,link與@import的差別


可參考



或觀看以下文章


外部引用CSS中 link与@import的区别

这两天刚写完XHTML加载CSS的几种方式,其中外部引用CSS分为两种方式link@import
本质上,这两种方式都是为了加载CSS文件,但还是存在着细微的差别。
差别1:老祖宗的差别。link属于XHTML标签,而@import完全是CSS提供的一种方式。
link标签除了可以加载CSS外,还可以做很多其它的事情,比如定义RSS,定义rel连接属性等,@import就只能加载CSS了。
差别2:加载顺序的差别。当一个页面被加载的时候(就是被浏览者浏览的时候),link引用的CSS会同时被加载,而@import引用的CSS会等到页面全部被下载完再被加载。所以有时候浏览@import加载CSS的页面时开始会没有样式(就是闪烁),网速慢的时候还挺明显(梦之都加载CSS的方式就是使用@import,我一边下载一边浏览梦之都网页时,就会出现上述问题)。
差别3:兼容性的差别。由于@import是CSS2.1提出的所以老的浏览器不支持,@import只有在IE5以上的才能识别,而link标签无此问题。
差别4:使用dom控制样式时的差别。当使用javascript控制dom去改变样式的时候,只能使用link标签,因为@import不是dom可以控制的。
大致就这几种差别了(如果还有什么差别,大家告诉我,我再补充上去),其它的都一样,从上面的分析来看,还是使用link标签比较好。
标准网页制作加载CSS文件时,还应该选定要加载的媒体(media),比如screen,print,或者全部all等。这个我到CSS高级教程中再给大家介绍。
注:
1,网友comehope在留言中提出了另一种区别。
差别5:@import可以在css中再次引入其他样式表,比如可以创建一个主样式表,在主样式表中再引入其他的样式表,如:
main.css
———————-
@import “sub1.css”;
@import “sub2.css”;
sub1.css
———————-
p {color:red;}
sub2.css
———————-
.myclass {color:blue}
这样更利于修改和扩展.
猴子提示:这样做有一个缺点,会对网站服务器产生过多的HTTP请求,以前是一个文件,而现在却是两个或更多文件了,服务器的压力增大,浏览量大的网站还是谨慎使用。有兴趣的可以观察一下像新浪等网站的首页或栏目首页代码,他们总会把css或js直接写在html里,而不用外部文件。


Meta標籤之http-equiv屬性詳解

以下資料來自
http://hi.baidu.com/pingpingzi188/blog/item/907a64820f8292a60cf4d2ec.html




Meta標籤之http-equiv屬性詳解

 META標籤是HTML語言HEAD區的一個輔助性標籤,
它位於HTML文檔頭部的 標記和 標記之間,它提供用戶不可見的信息。
META標籤有兩個重要的屬性:
HTTP標題信息 ( HTTP-EQUIV )和頁面描述信息 ( NAME )。

本文主要介紹HTTP-EQUIV屬性。

http-equiv ,相當於http的文件頭作用,它可以向瀏覽器傳回一些有用的信息,
以幫助正確和精確地顯示網頁內容。

Meta標籤的http-equiv屬性語法格式:
<meta http-equiv="參數" content="參數變量值">



常用的HTTP-EQUIV類型有:

1.Content-Language

說明:設定頁面使用的字符集用法:
注意:該META標籤定義了HTML頁面所使用的字符集為GB2132,就是國標漢字碼。
如果將其中的“charset=GB2312”替換成“BIG5”,則該頁面所用的字符集就是繁體中文Big5碼。當你瀏覽一些國外的站點時,IE瀏覽器會提示你要正確顯示該頁面需要下載xx語支持。這個功能就是通過讀取HTML頁面META標籤的Content-Type屬性而得知需要使用哪種字符集顯示該頁面的。如果系統裡沒有裝相應的字符集,則IE就提示下載。其他的語言也對應不同的charset,比如日文的字符集是“iso-2022-jp ”,韓文的是“ks_c_5601”。

2. Content-Type定義頁面製作所使用的文字語言

用法:<meta http-equiv="content-Type" content="text/html; charset=gb2312">
Content-Type的Content還可以是:text/xml等文檔類型;
Charset選項:ISO-8859-1(英文)、BIG5、UTF-8等字符集;
Content-Language的Content還可以是:EN、FR等語言代碼。

以上2個參數都可以幫助搜索引擎判斷網頁所使用的語言。


3.Refresh (刷新)

說明:讓網頁多長時間(秒)刷新自己,或在多長時間後讓網頁自動鏈接到其它網頁。
用法:<meta http-equiv="Refresh" content="2;URL=http://www.net.cn/">
注意:其中的5是指停留2秒鐘後自動刷新到URL網址。
網絡上常用的重定向方式有四種:Javascript重定向,Meta refresh重定向,301重定向,302重定向


4. Expires (期限)
說明:可以用於設定網頁的到期時間。一旦網頁過期,必須到服務器上重新傳輸。
用法:<meta http-equiv="expires" content="Wed, 20 Jun 2007 22:33:00 GMT">
注意:必须使用GMT的时间格式。注意:必須使用GMT的時間格式。

5. Pragma (cach模式)
說明:禁止瀏覽器從本地機的緩存中調閱頁面內容。
用法: <meta http-equiv="Pragma" content="no-cache">
注意:網頁不保存在緩存中,每次訪問都刷新頁面。這樣設定,訪問者將無法離線瀏覽。

 6. Set-Cookie (cookie設定)
說明:瀏覽器訪問某個頁面時會將它存在暫存中,下次再次訪問時就可從暫存中讀取,以提高速度。當你希望訪問者每次都刷新你廣告的圖標,或每次都刷新你的計數器,就要禁用暫存了。通常HTML文件沒有必要禁用緩存,對於ASP等頁面,就可以使用禁用暫存,因為每次看到的頁面都是在服務器動態生成的,暫存就失去意義。
如果網頁過期,那麼硬碟的cookie將被刪除。
用法: <meta http-equiv="Set-Cookie" content="cookievalue=xxx; expires=Wednesday, 20-Jun-2007 22:33:00 GMT; path=/">
注意:必須使用GMT的時間格式。

 7. Window-target (顯示窗口的設定)

說明:強制頁面在當前窗口以獨立頁面顯示。
用法: <meta http-equiv="Window-target" content="_top">
注意:這個屬性是用來防止別人在框架裡調用你的頁面。
Content選項:_blank、_top、_self、_parent。



常用的HTTP-EQUIV類型有:

2010/05/20

在家工作的心得…

「自由」是 SOHO族最大的好處,但也是最大的缺點。
想要 SOHO,就要先學會「自律」及「時間管理」。

2010/05/17

工作紀錄→首頁標題列出現亂碼

今天幫朋友的網站「外國語言中心」作修改。
發現首頁標題列若打中文就會出現亂碼。

同一網站內。其他頁面則都不會有此問題。
檢查過頁框組中的
原始碼中的預設編碼為charset=utf-8,也應該沒問題。

後來,想說bluehost 的主機應該是 Liunx系統,但「外國語言中心」的首頁名為 default.html,
想說改成 index.html,果然沒錯是首頁檔名的問題。

標題的亂碼就解決了

2010/05/14

時尚環保「杯」的背包或背帶…??

昨晚在坐922公車回北大特區時,看車上很多年輕人手拿飲料(紙杯或保麗龍、塑膠杯),若是自己總覺得一直拿在手上不方便且不環保。

前天新聞也才再報導說自備環保杯可享折扣。 心想,那為何不回到兒童時代,每人出門「背」水壺?

背包業者或甚至一些時尚名牌包包也可以製作精美好用的環保杯背帶或背包或腰包呢?
這個有市場嗎?有市場吧?
希望有人看到這個 idea,且成功開出一片新市場。

2010/05/06

王大寶又開始教電腦了!

自訂課程:

課程內容及時數長短由您的需求「量身訂作」,可來電諮詢您的需求。
只要一個人,就可以開班。
上課時間,可以先參考講師時間表: http://www.google.com/calendar/embed?src=justlearntw@gmail.com&ctz=Asia/Taipei
若有標示為【有空】的時段即可預訂上課。
可透過電話、電話語音留言、簡訊、Email、Facebook留言…等方式提出您的需求。我們會盡快與您連絡。
課程諮詢專線:0912-608‧945(讓您發‧就是我)或 0975-080‧580

自訂地方:

只要有桌椅、電源即可。免去舟車勞頓之苦!可在社區裡、家裡或離自己最近的地方!輕鬆學!
遠程另計交通費。
可自備電腦 或筆電 或由講師提供。
課程鐘點費用由人數平均。 例如若鐘點費為800元的課,四人上課, 則一個人平均200元。
課程鐘點費依課程難易度有所差異 800、1200、1600三種。 外縣市或企業包班另計交通費及鐘點費

精緻專業:

最專業的教學方式及設備,可「因材施教」。 因小班制精緻教學,老師可以依每個人不同的進度,給予適當的個別指導。 講師有十年多的電腦教學經驗、指導過社區大學、民間補習班、各大企業團體組織的教學。 電腦配備為最新的作業系統 Windows 7及20吋觸控式電腦。

熱門課程:

以下課程供選課參考。若有公司行號教育訓練或其他課程需求,歡迎來電洽詢。
  • 社區包班:歡迎社區管委會,物管中心或社區俱樂部洽談,可提供免費課程。在社區裡就可以輕鬆學!
  • 電腦入門:媽媽班、銀髮班、開始學會用滑鼠、鍵盤、觸控螢幕,中英文輸入法,完全不會電腦者。
  • 網路生活應用:玩 Facebook,網路電話 Skype,網路繳稅、繳水電瓦斯費,購物、查資料、交朋友…
  • 文書處理Word,學會用WORD製作名片、表格、履歷表、MENU、等文件。
  • 精算大師Excel,學會資料處理、數字計算、函數的應用、表單等。
  • 簡報PowerPoint,學會資料呈現,動畫音效、自我介紹、商品展示、相簿簡報等。
  • 會聲會影:影片剪輯、加字幕、配背景音樂、加轉場特效,燒錄成影片DVD。
  • 多媒體系列:Adobe Photoshop影像處理、Flash動畫、Dreamweaver網頁製作…等
  • 國際認證考試系列:微軟Office MOS國際認證,TQC Word認證,Adobe ACA國際認證
  • 其他:雲端應用程式:google doc.,數位教材製作、數位學習…電腦資訊應用相關主題…