當前位置:首頁 » 網頁前端 » web透明度
擴展閱讀
webinf下怎麼引入js 2023-08-31 21:54:13
堡壘機怎麼打開web 2023-08-31 21:54:11

web透明度

發布時間: 2023-05-17 03:51:20

A. 如何使WebView變透明

對於4.0以後的WebView空間,要想做到webView的背景透明,需要關閉WebView的硬體加速功能,可以在xml中配置此屬性。如下:

1、在xml文件中設置WebView的android:layerType屬性為software。

<WebView
android:id="@+id/webview"
android:layout_alignParentBottom="true"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layerType="software"
/>
2、在代雀虛斗碼中設置WebView的譽薯setBackground屬性

int color = getResources().getColor(R.color.transparent_black);
mWebView.setBackgroundColor(color); // 設置背景色
背景顏色的透明度比可以由您自己設置。可以測試通過

頃磨mWebView.loadUrl("http://www..com");
打開網路的首頁測試半透明效果。3、另要注意的是在編寫html時注意他的背影的設置。

B. 如何設置asp.net中Web控制項是透明》

在CSS中有一個Alpha濾鏡,這個濾鏡可以設置目標元梁空游素的透明度。還可以通過指定坐標,從而實現各種不同范圍的透明度。具體語法如下{filter: alphA(opacity=#opacity,finishopacity=#finishopacity,style=#style,startx=#startx,starty=#starty,finishx=#finishx,finishy=#finishy)}
具體參數含義如下:
opacity 透明度。默認的范圍是從0 到 100,他們其實是百分比的形式。也就是說,0代表完全透明,100代表完全不透明。
finishopacity 是一個可選參數,如果想要設置漸變的透明效果,就可以使用他們來指定結束時的透明度。范圍也是0 到 100。
style 指定透明區域的形狀特徵:0 代表統一形狀,1 代表線形,2 代表放射狀,3 代表矩形
startx 漸變透明效果開始處的 X坐標。
starty 漸變透明效果開始處的 Y坐標。
finishx 漸變透明效果結束處的 X坐標。
finishy 漸變透明效果結束處的 Y坐標。

以上的參數可以選用,可以只設置一個opacity
例如:
{filter:alpha(opacity=50)}
這個就是半透明的設置,只要把{}中的代碼加入到需要設置的模版中的{}的即可,記得與前面的代碼之間要用";"間隔,不然設置是無效的虧枝

例如:
我要設置模版區域背景的顏色(白色)+半透明[就是我現在blog的效橡銷果]
只要在
.modbox{}
.modbl{}
.modbc{}
.modbr{}
中都設置background-color:white
這些就是模版背景設置的ID

然後再在.modbox,.modbl,.modbc,.modbr{}如果沒有這個的話可以自己加一個
中加入filter : alpha(opacity=80)就可以達到所有模版的背景都是半透明的效果了

如果希望像我這樣只顯示blog的背景,別的都全透明的話,那麼就在別的模版中加入背景全透明的代碼即可
background:transparent 這就是背景全透明的代碼
各模版ID請參照鏈接:網路空間CSS說明

不過這樣的話,相關模版的主要區域是透明了,可是底下還會有一條顏色留著的,所以另外還要在
.modbl{}
.modbc{}
.modbr{}
中也加入背景全透明的代碼,這樣才能讓模版區域完全透明,就像我現在的效果一樣

另外這個參數目前只能用於背景色的設置,背景圖片無法設置為半透明

C. psweb格式不能分辨透明度

1、存儲為WEB格式的時候,必敬鄭須選擇GIF或孫數者PNG格式,而且亮凱頌保存之前要把背景層隱藏。
2、換成PNG24試試,8不支持Alpha通道,怕是有半透明顏色存在。

D. web中如何分別設置文字前面的點和字顏色

1、首先打開hbuilder軟體,新建一個html文件,裡面寫入3個p標簽,再在style標簽中設置p標簽的基本樣式,包括間距,字體大小等屬性:
2、然後在style標簽中用3種方法設置文字顏色,第一個p標簽用16進制設置顏色,每兩個數字為一組,最大數字為ff,它們代表紅綠藍三種顏色;第二種方法是rgba,也是紅綠藍三種顏色,只不過值變成了數字,最大為255表示顏色最鮮艷,比如把第一個設置為255就是最紅:
3、第三個標簽使用HSL色彩,其中H代表色調,值最大為360,0和360也是紅色,其他顏色在中間;s是飽和度用百分比來表示,0%表示最暗,100%表示最亮;L表示亮度取值也是百分比;rgba和hlsa中a都表示透明度,取值在0.0到1.0之間,0.0是完全透明,1.0為完全不透明:
4、最後打開瀏覽器就能三種方法表示出的顏色 :
Web 怎麼更改字體顏色
找到web字體的屬性代碼,語法:font color="#FF0000"我是紅色字體/font color 修改參數即可

E. 網頁背景怎麼調成透明

1、首先新建一個記事文本,重新命名背景顏色.html,按回車確認,如下圖所示。2、回到桌面選中新創建的背景顏色.html文件,右鍵選擇記事本打開,然後在記事本中手動輸入圖中代碼,這是一個標準的html頭尾格式。3、在中添加代碼:bgcolor="#000000",保存。4、這時在桌面打開背景顏色.html,打開頁面顯示為黑色背景

F. Web開發者色彩搭配快速指南

我從來都不是色彩理論的粉絲,想來大概是由於自己總是不得要領。我也希望自己能手執色輪,挑選出令朋友、客戶和家人都驚嘆的互補色、分散互補色和三色組合。

但理論總令我費解,老實說,我從來不覺得色彩理論在我的項目中有什麼作用。多少有點諷刺的是,我經常發現在選擇和使用了不錯的色彩後,我才對其背後的理論有更好的認識。在這篇文章中,你不會看到一個色輪,取而代之的是一種你可以拿來就用的簡單的色彩挑選流程。當然談消,閱讀過程中,你的潛意識會學到一些色彩理論,我強烈建議你在幾個月後重新閱讀本文並體會其中的理論,我保證,你會有更深的理解。

我們總是能碰到像是 一千萬種色彩 這類荒謬的事,想想吧,一千萬。而我們只需要選擇其中一種作為我們網站或品牌的基色。基色可以說是萬物之源,因此非常重要,但不用擔心,你不會選錯的。

從無到有挑出一種顏色很簡單,但那不是我們要做的。對於任何一個涉及到客戶的項目,你都應該盡可能全面地驗證你的選擇。否則,事情將變成你喜歡的顏色挑戰他們喜歡的顏色,他們就是給你錢的客戶,所以他們總是贏。

但不要過於擔心,你只需要確保你的選擇是基於某種理由的。

利用手頭的素材

如果客戶有自己的Logo,logo 的主色通常就是你尋找的初始色

不要使用競爭對手的主色

如果你的競爭對手有很強的品牌主導顏色,你要做的就是在自己的產品中排除這些顏色

想想你的目標用戶

一家殯儀館的網站與一家兒童俱樂部網站在色彩搭配上通常會有很大差異,想想誰是你的目標用戶,你想讓他們有什麼樣的感受(興奮、嚴肅、被呵護等等)

不要局限於思維定勢

即使你是在為年輕女孩設計網站,也不必非要選用粉紅色,跳出思維定勢去獲取用戶的認可。

玩一個文字游戲

如果你糾結於色彩選擇,寫下所有與你客戶業務有關的詞語,這些詞語應該能為你提供一些線索。如果仍然糾結,找一個介紹顏色含義的網站,看看哪一個最匹配。

現在,你的腦擾宴子裡面應該有一個基色了,它應該一種簡單的顏色,像是紅色、綠色、藍色、黃色或者粉紅色。接下來我們將會選合適的明暗度。

我們假設你的選擇是藍色。

與其在 Photoshop 提供的調色板中糾結,不如像藝術家一樣去」盜取「他人的設計決策。

首先,訪問 Dribbble 和 Designspiration 並點擊「色彩」鏈接,你將看到兩個相似的界面:

通過這種方法,你可以找到具有合適明暗度的藍色。

清新活力的品牌選擇明亮一些的藍色(下圖頂部5個中的一個),對於一些較商業和嚴肅的品牌,底部五個中的一個

在前面介紹的兩個網站中選擇一種明暗度,看真實的網站是如何使用該顏色的。你可以用 CSS-Tricks 中提到的任意一種顏色拾取技術在瀏覽器中獲取顏色的值。

看到基色有這么多明暗不同的版本只是第一步,你還將知道如何選擇適當的顏色來搭配你的基色。

現在你手上應該有一個 HEX 值了,我的是#30c9e8。現在要做的是從該顏色出發,創建一套色彩組合。

當提到創建色彩組合的時候,你可能會聯想到一些類似如下的圖片

[圖片上傳失敗...(image-a92d69-1525677589902)]]( https://upload-images.jianshu.io/upload_images/306465-3284c48d063d0bcd.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240 )

這類色彩組合的問題是它們通常不太實際,大多數的色彩組合包含了太多你根本用不上的顏色,尤其是考慮到我們始終會用到三種中性的顏色:

如果你執意要把中性顏色增加到8種或者9種,結果將會是一團糟。其實你只需要再增加兩種顏色:

如果你能含李知將網站所用顏色控制在上面提到的5中顏色中,你將會得到一個遠好於混雜了各類互補色的網站

強調色在你的網站中只佔很少一部分比例,通常是為了引導用戶行動,因此需要醒目。

你下一步要做的是打開 Paletton 並輸入基色的 HEX 值。

然後,點擊「添加互補色」按鈕,然後你就得到你的強調色了——橙色

如果你對自動產生的強調色不滿意,你還可以下圖左上角的按鈕進行微調

我個人而言,我非常喜歡點擊三角按鈕產生的紅色,所以紅色將會是我的強調色。當然,Paletton自動挑選顏色的背後是有科學理論可依的,但我們暫按不表。

好了,下面就是我們的色彩組合了,漂亮的藍色,醒目的紅色以及搭什麼都漂亮的白色。

現在唯一還缺的就是一些灰色。

在我的大多數項目中,我發現2種明暗度的灰色非常有用——深灰和淺灰,你會經常用到他們。

深灰通常是用在文字上,淺灰則是在你需要與白色有細微差異的時候使用(白色通常都是背景色)。

你可以通過下面兩種方式中的任意一種選擇你要的灰色:

這里我們採用 Erica Schoonmaker』s technique 方法,首先隨意選擇兩種灰色(一明一暗,這里我們選擇使用#424242和#fafafa),然後按下面的步驟操作:

我要指出的是當基色為藍色的時候,該方法效果最好。基色為其他顏色時最好將不透明度調低至5%到10%之間,或者直接選出兩種灰色。

到此我們的色彩搭配宣告完成, 希望你為此感到驕傲!

我們已經有了一套色彩組合,現在的工作是將其應用到你的網站上,這完全是另一個話題了,不過為了讓你有個概念,簡單舉個例子。下面分別是一網頁的灰度設計稿和著色後版本。

小貼士:如果你糾結網站的色彩,可以先通過灰度設計稿確定布局,弄清楚元素間的層級關系,然後嘗試不同的顏色搭配。

可以看出藍色是主色,佔了大量的篇幅,而且圖標中也有採用。

我們的強調色,漂亮且醒目的占據了很小的一塊區域。對強調色的使用越少,其突出。

深灰色用在了文字,標志和圖標輪廓上(即使是細小如圖標這樣的元素,也值得去研究色彩的搭配,記住細節決定整體)。

白色和淺灰色組成了背景色。實際上可以不用淺灰色,不過我發現這一細節的處理讓整個網站更加的賞心悅目。

需要強調的是,文字的顏色務必要與背景形成足夠的反差,這樣才不會對色盲和弱視人士造成困擾。有許多工具可以幫助你尋找符合 WCAG Guidelines. 的顏色。兩個流行的工具分別是 WebAim Color Contrast Checker 以及 Lea Verou 的 Contrast Ratio 。

如你所見,無需更多的色彩,今天我們創建的這款色彩組合就能打造出漂亮的網頁。但這並不意味你的選擇要局限在這幾種顏色中。

在設計過程當中,你可能會說引入更多的顏色是合理的,這當然沒問題,只要細心,你完全可以利用本文介紹的技巧為你的色彩組合找到更多顏色。

重要的是,在色彩選擇這件事上,你做的越多就會變得越擅長,你會漸漸知道哪些顏色可以在一起,哪些不能。有時候,本文介紹的方法可能會產生低於你期望的結果,請隨意調整。

G. 什麼是 Web 3.0 以及它將如何幫助您解剖最近很火的web板塊

盡管 Web 多年來取得了許多進步,但許多用戶仍然擔心其當前結構對其施加的限制。因此,除其他外,越來越多的人相信 Web 3.0 提供了卓越的體驗,這是您應該了解的有關 Web 3.0 的所有信息。

在互聯網的早期,內容是從 ISP(互聯網服務提供商)託管的靜態網站或 GeoCities 等網站消費的。信息的交換速度比以往任何時候都快得多,但交互性很低。

隨著 1999 年伺服器技術的進步,互聯網連接速度提高,使從 Web 1.0 到 Web 2.0 的過渡更快。

快進到 2000 年代初期 Web 2.0 的曙光,隨著越來越多的用戶被賦予創建內容的能力,交互性激增。MySpace 和 Facebook 等社交媒體網站鼓勵互動,因為人們會生成不同形式的內容。Web 2.0 時代在很大程度上由三件事定義:移動、社交和雲。

萬維網的創始人蒂姆·伯納斯·李將 Web 3.0 描述為「讀寫執行」。它是 Web 的一個版本,它賦予用戶創建和執行他們自己的工具和軟體的能力,而不是依賴其他人來獲取軟體。

Web 3.0 雖然仍處於起步階段,但有望使開放、去信任和無需許可的網路成為可能。它由幾個元素組成,這些元素可以作為其成功的基石:邊緣計算、分散數據網路、3D 圖形和人工智慧。

語義網是 1990 年代萬維網聯盟成員提出的一個概念。它旨在賦予單詞以意義,以便機器可以讀取網路上的內容。這使程序可以更輕松地在 Web 上共享、連接和創建內容。

有了語義網,程序將能夠組織更廣泛的數據集來執行任務。例如,目前很多內容都沒有標記,這意味著搜索引擎主要依靠關鍵字來識別相關內容。這可能導致不太准確的搜索結果。在互聯網上創建一種通用語言將有助於使內容的組織、創建和使用更加可靠。

人工智慧將成為構建未來網路的重要工具。語義網使人工智慧更容易執行自然語言處理,從而獲得更快、更准確的搜索結果,以及其他好處。

三維設計將成為 Web 3.0 的優先事項,因為用戶可以從博物館指南和計算機 游戲 中增強的交互性中獲益。從文本到視覺顯示的過渡可能構成 Web 3.0 運動的主要部分。

區塊鏈網路提供了存儲和使用數據的新方法。區塊鏈的透明、去中心化網路與其共識系統相結合,可以根據嵌入代碼中的商定規則共享可驗證的信息。

互聯網的當前結構基於大眾分類法,這是一種使用用戶添加的標簽和標簽來組織數據和數字內容的方法,以識別內容。

網頁是鏈接的,網站之間共享的數據在很大程度上取決於其內容的人群知識。藉助 Web 3.0,機器可以識別更廣泛的數據集以對內容進行分類。這使得用更有用的內容吸引用戶變得更容易。

在 Web 2.0 上提供數字 社會 信任層的中介往往依賴於價值的提取而不是吸引。他們擁有不成比例的高權力水平,這使人們在他們的平台上面臨丟失他們不想泄露的數據的風險。

例如,傳輸控制協議/互聯網協議有助於確定我們的計算機如何從全球伺服器上的不同資料庫請求數據。很大一部分資料庫和伺服器是集中式的,這就質疑人們對他們的數據真正擁有多少控制權。

開發人員工具也高度集中,因為它們幾乎總是由私人公司所有。這包括 Facebook 等大型 科技 公司擁有的 API。

此外,開發人員製作網站和應用程序所依賴的網路平台默認是私有的,這意味著需要復雜的許可權集(通常來自大型 科技 公司)才能使用網路開發軟體。這形成了具有嚴格規則的封閉網路。

去中心化互聯網(Web 3.0)的底層數據結構基於區塊鏈而非傳統資料庫。數據結構消除了對用戶名和密碼的需要,區塊鏈的防篡改特性使不同組之間在開放項目上的協作變得容易。

項目可以託管在分散的雲和獨立的數據中心上,這是公共網路和工具的完美結構。這意味著任何人都可以使用此類平台,而無需獲得大型 科技 公司或中心化看門人的許可。

網路的透明度意味著可以實現真正免費的互聯網,因為人們更難以進行審查或在其應用程序中包含惡意代碼。

正如我們所知,網路為我們提供了很好的服務,提供了無盡的信息海洋來改善我們的日常生活。

盡管如此,它還是提出了許多 Web 3.0 可以解決的挑戰。盡管 Web 3.0 前景廣闊,但仍有很長的路要走。信息的無縫交換需要 Web 3.0 項目之間更加統一。此外,還需要為 Web 3.0 構建更多結構才能真正取得成功。

新的交易系統很可能是 Web 3.0 的產物,因為區塊鏈在定義不同網路的激勵措施方面變得越來越重要,在這些網路中人們可以更好地控制自己的數據以及與誰共享數據。

H. webgis 怎麼設置服務透明度

你可以在請求的wms上加上opacity參數,回來的圖片就有透明度了

I. web前端網頁顏色的搭配技巧

一般來說,網頁的背景色應該柔和一些、素一些、淡一些,再配上深色的文字,使人看起來自然、舒暢對於做網頁的初學者可能更習慣於使用一些漂亮的圖片作為自己網頁的背景,但是,瀏覽一下大型的商業網站,你會發現他們更多運用的是白色、藍色、黃色等,使得網頁顯得典雅,大方和溫馨。更重要的是,這樣可以大大加快瀏覽者打開網頁的速度。

一般來說,網頁的背景色應該柔和一些、素一些、淡一些,再配上深色的文字,使人看起來自然、舒暢。而為了追求醒目的視覺效果,可以為標題使用較深的顏 色。下面是我做網頁和瀏覽別人的網頁時,對網頁背景色和文字色彩搭配積累的經驗,這些顏色可以做正文的底色,也可以做標題的底色,再搭配不同的字體,一定 會有不錯的效果,希望對大家在製作網頁時有用。

BgcolorΚ〃#F1FAFA〃———做正文的背景色好,淡雅

BgcolorΚ〃#E8FFE8〃———做標題的背景色較好

BgcolorΚ〃#E8E8FF〃———做正文的背景色較好,文字顏色配黑色

BgcolorΚ〃#8080C0〃———上配黃色白色文字較好

BgcolorΚ〃#E8D098〃———上配淺藍色或藍色文字較好

BgcolorΚ〃#EFEFDA〃———上配淺藍色或紅色文字較好

BgcolorΚ〃#F2F1D7〃———配黑色文字素雅,如果是紅色則顯得醒目

BgcolorΚ〃#336699〃———配白色文字好看些

BgcolorΚ〃#6699CC〃———配白色文字好看些,可以做標題

BgcolorΚ〃#66CCCC〃———配白色文字好看些,可以做標題

BgcolorΚ〃#B45B3E〃———配白色文字好看些,可以做標題

BgcolorΚ〃#479AC7〃———配白色文字好看些,可以做標題

BgcolorΚ〃#00B271〃———配白色文字好看些,可以做標題

BgcolorΚ〃#FBFBEA〃———配黑色文字比較好看,一般作為正文

BgcolorΚ〃#D5F3F4〃———配黑色文字比較好看,一般作為正文

BgcolorΚ〃#D7FFF0〃———配黑色文字比較好看,一般作為正文

BgcolorΚ〃#F0DAD2〃———配黑色文字比較好看,一般作為正文

BgcolorΚ〃#DDF3FF〃———配黑色文字比較好看,一般作為正文

淺綠色底配黑色文字,或白色底配藍色文字都很醒目,但前者突出背景,後者突出文字。紅色底配白色文字,比較深的底色配黃色文字顯得非常有效果。

此文只是起一個「拋磚引玉」的作用,大家可以發揮想像力,搭配出更有新意、更醒目的顏色,使網頁更具有吸引力

如今,互聯網越來越走近我們的生活,網上沖浪也漸漸成為我們生活不可缺少的一部分。網路世界五彩繽紛,涌現出大量優秀精美的網頁。大量網路信息的呈 現,無非就是通過文本、圖像、Flash動畫等,其中, 文本是網頁中最為重要的設計元素。對於網頁設計初學者而言,了解和掌握網頁設計中的文字排版設計就顯得尤為重要,下面筆者想談談一己之見。

文字的格式化

字型大小、字體、行距

字型大小大小可以用不同的方式來計算,例如磅#quotel.quoter#或像素(Pixel)。因為以像素技術為基礎單位列印時需要轉換為磅,所以,建議採用磅為單位。

最適合於網頁正文顯示的字體大小為12磅左右,現在很多的綜合性站點,由於在一個頁面中需要安排的內容較多,通常採用9磅的字型大小。較大的字體可用於標 題或其他需要強調的地方,小一些的字體可以用於頁腳和輔助信息。需要注意的是,小字型大小容易產生整體感和精緻感,但可讀性較差。

網頁設計者可以用字體來更充分地體現設計中要表達的情感。字體選擇是一種感性、直觀的行為。但是,無論選擇什麼字體,都要依據網頁的總體設想和瀏覽者 的需要。例如:粗體字強壯有力,有男性特點,適合機械、建築業等內容;細體字高雅細致,有女性特點,更適合服裝、化妝品、食品等行業的內容。在同一頁面 中,字體種類少,版面雅緻,有穩定感;字體種類多,則版面活躍,豐富多彩。關鍵是如何根據頁面內容來掌握這個比例關系。

從加強平台無關性的角度來考慮,正文內容最好採用預設字體。因為瀏覽器是用本地機器上的字型檔顯示頁面內容的。作為網頁設計者必須考慮到大多數瀏覽者的 機器里只裝有三種字體類型及一些相應的特定字體。而你指定的字體在瀏覽者的機器里並不一定能夠找到,這給網頁設計帶來很大的局限。解決問題的辦法是:在確 有必要使用特殊字體的地方,可以將文字製成圖像,然後插入頁面中。

行距的變化也會對文本的可讀性產生很大影響。一般情況下,接近字體尺寸的行距設置比較適合正文。行距的常規比例為10:12,即用字10點,則行距 12點。這主要是出於以下考慮:適當的行距會形成一條明顯的水平空白帶,以引導瀏覽者的目光,而行距過寬會使一行文字失去較好的延續性。

除了對於可讀性的影響,行距本身也是具有很強表現力的設計語言,為了加強版式的裝飾效果,可以有意識地加寬或縮窄行距,體現獨特的審美意趣。例如,加 寬行距可以體現輕松、舒展的情緒,應用於娛樂性、抒情性的內容恰如其分。另外,通過精心安排,使寬、窄行距並存,可增強版面的空間層次與彈性,表現出獨到 的匠心。

行距可以用行高(line-height)屬性來設置,建議以磅或默認行高的百分數為單位。例如:{line-height:20pt}、{line-height:150%}。

文字的整體編排

頁面里的正文部分是由許多單個文字經過編排組成的群體,要充分發揮這個群體形狀在版面整體布局中的作用。從藝術的角度可以將字體本身看成是一種藝術形 式,它在個性和情感方面對人們有著很大影響。在網頁設計中,字體的處理與顏色、版式、圖形等其他設計元素的處理一樣非常關鍵。從某種意義上來講,所有的設 計元素都可以理解為圖形。

1.文字的圖形化

字體具有兩方面的作用:一是實現字意與語義的功能,二是美學效應。所謂文字的圖形化,即是強調它的美學效應,把記號性的文字作為圖形元素來表現,同時 又強化了原有的功能。作為網頁設計者,既可以按照常規的方式來設置字體,也可以對字體進行藝術化的設計。無論怎樣,一切都應圍繞如何更出色地實現自己的設 計目標。

將文字圖形化、意象化,以更富創意的形式表達出深層的設計思想,能夠克服網頁的單調與平淡,從而打動人心。

2.文字的疊置

文字與圖像之間或文字與文字之間在經過疊置後,能夠產生空間感、跳躍感、透明感、雜音感和敘事感,從而成為頁面中活躍的、令人注目的元素。雖然疊置手 法影響了文字的可讀性,但是能造成頁面獨特的視覺效果。這種不追求易讀,而刻意追求「雜音」的表現手法,體現了一種藝術思潮。因而,它不僅大量運用於傳統 的版式設計,在網頁設計中也被廣泛採用。

3.標題與正文

在進行標題與正文的編排時,可先考慮將正文作雙欄、三欄或四欄的編排,再進行標題的置入。將正文分欄,是為了求取頁面的空間與彈性,避免通欄的呆板以 及標題插入方式的單一性。標題雖是整段或整篇文章的標題,但不一定千篇一律地置於段首之上。可作居中、橫向、豎向或邊置等編排處理,甚至可以直接插入字群 中,以新穎的版式來打破舊有的規律。

4.文字編排的四種基本形式

頁面里的正文部分是由許多單個文字經過編排組成的群體,要充分發揮這個群體形狀在版面整體布局中的作用。

兩端均齊:文字從左端到右端的長度均齊,字群形成方方正正的面,顯得端正、嚴謹、美觀。

居中排列:在字距相等的情況下,以頁面中心為軸線排列,這種編排方式使文字更加突出,產生對稱的形式美感。

左對齊或右對齊:左對齊或右對齊使行首或行尾自然形成一條清晰的垂直線,很容易與圖形配合。這種編排方式有松有緊,有虛有實,跳動而飄逸,產生節奏與韻律的形式美感。左對齊符合人們閱讀時的習慣,顯得自然;右對齊因不太符合閱讀習慣而較少採用,但顯得新穎。

繞圖排列:將文字繞圖形邊緣排列。如果將底圖插入文字中,會令人感到融洽、自然。

文字的強調

1.行首的強調

將正文的第一個字或字母放大並作裝飾性處理,嵌入段落的開頭,這在傳統媒體版式設計中稱之為「下墜式」。此技巧的發明溯源於歐洲中世紀的文稿抄寫員。 由於它有吸引視線、裝飾和活躍版面的作用,所以被應用於網頁的文字編排中。其下墜幅度應跨越一個完整字行的上下幅度。至於放大多少,則依據所處網頁環境而 定。

2.引文的強調

在進行網頁文字編排時,常常會碰到提綱挈領性的文字,即引文。引文概括一個段落、一個章節或全文大意,因此在編排上應給予特殊的頁面位置和空間來強 調。引文的編排方式多種多樣,如將引文嵌入正文的左右側、上方、下方或中心位置等,並且可以在字體或字型大小上與正文相區別而產生變化。

3.個別文字的強調

如果將個別文字作為頁面的訴求重點,則可以通過加粗、加框、加下劃線、加指示性符號、傾斜字體等手段有意識地強化文字的視覺效果,使其在頁面整體中顯得出眾而奪目。另外,改變某些文字的顏色,也可以使這部分文字得到強調。這些方法實際上都是運用了對比的法則。

文字的顏色

在網頁設計中,設計者可以為文字、文字鏈接、已訪問鏈接和當前活動鏈接選用各種顏色。例如,如果你使用FrontPage編輯器,默認的設置是這樣 的:正常字體顏色為黑色,默認的鏈接顏色為藍色,滑鼠點擊之後又變為紫紅色。使用不同顏色的文字可以使想要強調的部分更加引人注目,但應該注意的是,對於 文字的顏色,只可少量運用,如果什麼都想強調,其實是什麼都沒有強調。況且,在一個頁面上運用過多的顏色,會影響瀏覽者閱讀頁面內容,除非你有特殊的設計 目的。

顏色的運用除了能夠起到強調整體文字中特殊部分的作用之外,對於整個文案的情感表達也會產生影響。這涉及色彩的情感象徵性問題,限於篇幅,在這里不做深入探討。

另外需要注意的是文字顏色的對比度,它包括明度上的對比、純度上的對比以及冷暖的對比。這些不僅對文字的可讀性發生作用,更重要的是,你可以通過對顏色的運用實現想要的設計效果、設計情感和設計思想。

一、色彩處理

色彩是人的視覺最敏感的東西。主頁的色彩處理得好,可以錦上添花,達到事半功倍的效果。色彩總的應用原則應該是「總體協調,局部對比」,也就是:主頁的整 體色彩效果應該是和諧的,只有局部的、小范圍的地方可以有一些強烈色彩的對比。在色彩的運用上,可以根據主頁內容的需要,分別採用不同的主色調。因為色彩 具有象徵性,例如:嫩綠色、翠綠色、金黃色、灰褐色就可以分別象徵著春、夏、秋、冬。其次還有職業的標志色,例如:軍警的橄欖綠,醫療衛生的白色等。色彩 還具有明顯的心理感覺,例如冷、暖的感覺,進、退的效果等。另外,色彩還有民族性,各個民族由於環境、文化、傳統等因素的影響,對於色彩的喜好也存在著較 大的差異。充分運用色彩的這些特性,可以使我們的主頁具有深刻的藝術內涵,從而提升主頁的文化品位。下面介紹幾種常用的配色方案:

1.暖色調。即紅色、橙色、黃色、赭色等色彩的搭配。這種色調的運用,可使主頁呈現溫馨、和煦、熱情的氛圍。

2.冷色調。即青色、綠色、紫色等色彩的搭配。這種色調的運用,可使主頁呈現寧靜、清涼、高雅的氛圍。

3.對比色調。即把色性完全相反的色彩搭配在同一個空間里。例如:紅與綠、黃與紫、橙與藍等。這種色彩的搭配,可以產生強烈的視覺效果,給人亮麗、鮮艷、 喜慶的感覺。當然,對比色調如果用得不好,會適得其反,產生俗氣、刺眼的不良效果。這就要把握「大調和,小對比」這一個重要原則,即總體的色調應該是統一 和諧的,局部的地方可以有一些小的強烈對比。

最後,還要考慮主頁底色(背景色)的深、淺,這里借用攝影中的一個術語,就是「高調」和「低調」。底色淺的稱為高調;底色深的稱為低調。底色深,文字的顏 色就要淺,以深色的背景襯托淺色的內容(文字或圖片);反之,底色淡的,文字的顏色就要深些,以淺色的背景襯托深色的內容(文字或圖片)。這種深淺的變化 在色彩學中稱為「明度變化」。有些主頁,底色是黑的,但文字也選用了較深的色彩,由於色彩的明度比較接近,讀者在閱覽時,眼睛就會感覺很吃力,影響了閱讀 效果。當然,色彩的明度也不能變化太大,否則屏幕上的亮度反差太強,同樣也會使讀者的眼睛受不了。

網頁色彩的搭配

網頁的色彩是樹立網站形象的關鍵之一,色彩搭配卻是網友們感到頭疼的問題。網頁的背景,文字,圖標,邊框,超鏈接…,應該採用什麼樣的色彩,應該搭配什麼色彩才能最好的表達出預想的內涵呢?阿捷這里談一些心得,希望對你有所啟發。

首先我們先來了解一些色彩的基本知識:

1.顏色是因為光的折射而產生的。

2.紅,黃,藍是三原色,其它的色彩都可以用這三種色彩調和而成。網頁html語言中的色彩表達即是用這三種顏色的數值表示例如:紅色是color (255,0,0)十六進制的表示方法為(FF0000)白色為(FFFFFF), 我們經常看到的」bgColor=#FFFFFF」就是指背景色為白色。

3.顏色分非彩色和彩色兩類。非彩色是指黑,白,灰系統色。彩色是指除了非彩色以外的所有色彩。

4.任何色彩都有飽和度和透明度的屬性,屬性的變化產生不同的色相,所以至少可以製作幾百萬種色彩。

網頁製作用彩色還是非彩色好呢?根據專業的研究機構研究表明:彩色的記憶效果是黑白的3.5倍。也就是說,在一般情況下,彩色頁面較完全黑白頁面更加吸引人。

我們通常的做法是:主要內容文字用非彩色(黑色),邊框,背景,圖片用彩色。這樣頁面整體不單調,看主要內容也不會眼花。

●非彩色的搭配

黑白是最基本和最簡單的搭配,白字黑底,黑底白字都非常清晰明了。 灰色是萬能色,可以和任何彩色搭配,也可以幫助兩種對立的色彩和諧過渡。如果你實在找不出合適的色彩,那麼用灰色試試,效果絕對不會太差。

●彩色的搭配

色彩千變萬化,彩色的搭配是我們研究的重點。我們依然需要進一步學習一些色彩的知識。

一.色環。我們將色彩按」紅->黃->綠->藍->紅」依次過度漸變,就可以得到一個色彩環。色環的兩端是暖色和寒色,當中是中型色。(如下圖)

紅.橙.橙黃.黃.黃綠.綠.青綠.藍綠.藍.藍紫.紫.紫紅.紅

暖色系 中性系 寒色系 中性系

二.色彩的心理感覺。不同的顏色會給瀏覽者不同的心理感受。

紅色—是一種激奮的色彩。刺激效果,能使人產生沖動,憤怒,熱情,活力的感覺。

綠色—介於冷暖兩中色彩的中間,顯得和睦,寧靜,健康,安全的感覺。 它和金黃,淡白搭配,可以產生優雅,舒適的氣氛。

橙色—也是一種激奮的色彩,具有輕快,歡欣,熱烈,溫馨,時尚的效果。

黃色—具有快樂,希望,智慧和輕快的個性,它的明度最高。

藍色—是最具涼爽,清新,專業的色彩。它和白色混合,能體現柔順,淡雅,浪漫的氣氛(象天空的色彩:)

白色—具有潔白,明快,純真,清潔的感受。

黑色—具有深沉,神秘,寂靜,悲哀,壓抑的感受。

灰色—具有中庸,平凡,溫和,謙讓,中立和高雅的感覺。

每種色彩在飽和度,透明度上略微變化就會產生不同的感覺。以綠色為例,黃綠色有青春,旺盛的視覺意境,而藍綠色則顯得幽寧,陰深。

●網頁色彩搭配的原理

1.色彩的鮮明性。網頁的色彩要鮮艷,容易引人注目。

2.色彩的獨特性。要有與眾不同的色彩,使得大家對你的印象強烈。(參考設計思考第二篇網站CI的標准色彩一節)

3.色彩的合適性。就是說色彩和你表達的內容氣氛相適合。如用粉色體現女性站點的柔性。

4.色彩的聯想性。不同色彩會產生不同的聯想,藍色想到天空,黑色想到黑夜,紅色想到喜事等,選擇色彩要和你網頁的內涵相關聯。

●網頁色彩掌握的過程

隨著網頁製作經驗的積累,我們用色有這樣的一個趨勢:單色->五彩繽紛->標准色->單色。一開始因為技術和知識缺乏,只能製作 出簡單的網頁,色彩單一;在有一定基礎和材料後,希望製作一個漂亮的網頁,將自己收集的最好的圖片,最滿意色彩堆砌在頁面上;但是時間一長,卻發現色彩雜 亂,沒有個性和風格;第三次重新定位自己的網站,選擇好切合自己的色彩,推出的站點往往比較成功;當最後設計理念和技術達到頂峰時,則又返樸歸真,用單一 色彩甚至非彩色就可以設計出簡潔精美的站點。

○網頁色彩搭配的技巧

文章寫到這里,有心急的網友要問了:「到底用什麼色彩搭配好看呢?你能不能推薦幾種配色方案?」別急,這里有一點技巧,可以幫助你迅速成為調色大師:)

1.用一種色彩。這里是指先選定一種色彩,然後調整透明度或者飽和度,(說得通俗些就是將 色彩變淡或則加深),產生新的色彩,用於網頁。這樣的頁面看起來色彩統一,有層次感。

2.用兩種色彩。先選定一種色彩,然後選擇它的對比色(在photoshop里按ctrl+shift+I)。我的主頁用藍色和黃色就是這樣確定的。整個頁面色彩豐富但不花稍。

3.用一個色系。簡單的說就是用一個感覺的色彩,例如淡藍,淡黃,淡綠;或者土黃,土灰,土藍。確定色彩的方法各人不同,我是在photoshop里按前景色方框,在跳出的拾色器窗中選擇」自定義」,然後在」色庫」中選就可以了:)

4.用黑色和一種彩色。比如大紅的字體配黑色的邊框感覺很」跳」。

在網頁配色中,忌諱的是:

1.不要將所有顏色都用到,盡量控制在三種色彩以內。

2.背景和前文的對比盡量要大,(絕對不要用花紋繁復的圖案作背景),以便突出主要文字內容

顏 色 搭 配

一、紅色的色感溫暖,性格剛烈而外向,是一種對人刺激性很強的色。紅色容易引起人的注意,也容易使人興奮、激動、緊張、沖動、還是一種容易造成人視覺疲勞的色。

a) 在紅色中加入少量的黃,會使其熱力強盛,趨於躁動、不安。

b) 在紅色中加入少量的藍,會使其熱性減弱,趨於文雅、柔和。

c) 在紅色中加入少量的黑,會使其性格變的沉穩,趨於厚重、朴實。

d) 在紅中加入少量的白,會使其性格變的溫柔,趨於含蓄、羞澀、嬌嫩。

二、黃色的性格冷漠、高傲、敏感、具有擴張和不安寧的視覺印象。黃色是各種色彩中,最為嬌氣的一種色。只要在純黃色中混入少量的其它色,其色相感和色性格均會發生較大程度的變化。

a) 在黃色中加入少量的藍,會使其轉化為一種鮮嫩的綠色。其高傲的性格也隨之消失,趨於一種平和、潮潤的感覺。

b) 在黃色中加入少量的紅,則具有明顯的橙色感覺,其性格也會從冷漠、高傲轉化為一種有分寸感的熱情、溫暖。

c) 在黃色中加入少量的黑,其色感和色性變化最大,成為一種具有明顯橄欖綠的復色印象。其色性也變的成熟、隨和。

d) 在黃色中加入少量的白,其色感變的柔和,其性格中的冷漠、高傲被淡化,趨於含蓄,易於接近。

三、藍色的色感冷嘲熱諷,性格朴實而內向,是一種有助於人頭腦冷嘲熱諷靜的色。藍色的朴實、內向性格,常為那些性格活躍、具有較強擴張力的色彩,提供一 個深遠、廣埔、平靜的空間,成為襯托活躍色彩的友善而謙虛的朋友。藍色還是一種在淡化後仍然似能保持較強個性的色。如果在藍色中分別加入少量的紅、黃、 黑、橙、白等色,均不會對藍色的性格構成較明顯的影響力。

a) 如果在橙色中黃的成份較多,其性格趨於甜美、亮麗、芳香。

b) 在橙色中混入小量的白,可使橙色的知覺趨於焦躁、無力。

四、綠色是具有黃色和藍色兩種成份的色。在綠色中,將黃色的擴張感和藍色的收縮感相中庸,將黃色的溫暖感與藍色的寒冷感相抵消。這樣使得綠色的性格最為平和、安穩。是一種柔順、恬靜、潢足、優美的色。

a) 在綠色中黃的成份較多時,其性格就趨於活潑、友善,具有幼稚性。

b) 在綠色中加入少量的黑,其性格就趨於莊重、老練、成熟。

c) 在綠色中加入少量的白,其性格就趨於潔凈、清爽、鮮嫩。

五、 紫色的明度在有彩色的色料中是最低的。紫色的低明度給人一種沉悶、神秘的感覺。

a) 在紫色中紅的成份較多時,其知覺具有壓抑感、威脅感。

b) 在紫色中加入少量的黑,其感覺就趨於沉悶、傷感、恐怖。

c) 在紫色中加入白,可使紫色沉悶的性格消失,變得優雅、嬌氣,並充滿女性的魅力。

六、 白色的色感光明,性格朴實、純潔、快樂。白色具有聖潔的不容侵犯性。如果在白色中加入其它任何色,都會影響其純潔性,使其性格變的含蓄。

a) 在白色中混入少量的紅,就成為淡淡的粉色,鮮嫩而充滿誘惑。

b) 在白色中混入少量的黃,則成為一種乳黃色,給人一種香膩的印象。

c) 在白色中混入少量的藍,給人感覺清冷、潔凈。

d) 在白色中混入少量的橙,有一種乾燥的氣氛。

e) 在白色中混入少量的綠,給人一種稚嫩、柔和的感覺。

f) 在白色中混入少量的紫,可誘導人聯想到淡淡的芳香。