CSS跨越版型限制的進階用法

■ 跨越層級的優先順序屬性：

不同的網頁版型，會因不同的【視覺設計需求】及【功能模組特性】的配置需求而將頁面分割成不同的固定區塊大小和固定的檔案格式；然而你可以透過CSS來跨越版型的限制，自行定義圖檔格式與圖檔寬高等…

作法：

1. 先選定風格版型並完成首、內頁架構確定更新。

2. 預覽前台頁面，在頁面上點選滑鼠右鍵，檢視原始碼。

3. 查看HTML要修改的區塊，於<STYLE></STYLE>之間CSS的設定資料中，套用的標籤名稱為何？引用【類別選擇器(Class)】或是【識別字選擇器(ID)】。

4. 於其專屬的CSS樣式檔中，增加相同的標籤，設定新的屬性及屬性質；如與HTML中的屬性及屬性質重複的話，只要在新的屬性質中加入!important，此時即使優先權較低，有加入!important的屬性質仍會被優先使用。例如：color:red !important; 這時即使優先權較低，文字也會變成紅色。

※ 也可以透過在新的屬性質中加入!important的方式將WeB66後台的 上傳空間 中的圖檔替換掉系統預設的圖檔；如此一來檔案格式、名稱及尺寸大小皆可重新定義。

-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

■ 可設定整個元件顯示的方式屬性：

如你所選用的版型有未使用的功能模組需隱藏時，可以使用以下兩種屬性：

1. display:none  none代表不顯示，且此元件不佔任何空間。

2. visibility:hidden  hidden代表隱藏，但仍佔有空間，此與display:none不同。

作法：

需隱藏的功能模組分圖、文兩部分，步驟同上；不同的只是需要在新增的對應CSS標籤中加入display:none或visibility:hidden 其中一種屬性即可。

例如：#edgesp_top{display:none}與.edgesp_text{display:none }