導航:首頁 > 萬維百科 > 網頁設計怎麼設置漸變背景

網頁設計怎麼設置漸變背景

發布時間:2020-12-02 22:35:42

1、網頁設計:如何讓兩張背景圖片融合在一起(漸變)?

看看是不是同一個背景圖。是的話改圖,不是的話去掉單獨的樣式。

2、Frontpage網頁設計,網頁背景顏色漸變問題?

最好用PS處理一張漸變背景圖,在網頁設計中插入當背景

3、如何使用網頁漸變色來提升設計逼格

直接用圖簡單;
通過使用 css3 漸變可以讓背景兩個或多個指定的顏色之間顯示平穩的過渡,由於用到css3所以需要考慮下瀏覽器兼容問題,例如:
從左到右的線性漸變,且帶有透明度的樣式:
#grad {
background: -webkit-linear-gradient(left,rgba(255,0,0,0),rgba(255,0,0,1)); /* Safari 5.1 - 6 */
background: -o-linear-gradient(right,rgba(255,0,0,0),rgba(255,0,0,1)); /* Opera 11.1 - 12*/
background: -moz-linear-gradient(right,rgba(255,0,0,0),rgba(255,0,0,1)); /* Firefox 3.6 - 15*/
background: linear-gradient(to right, rgba(255,0,0,0), rgba(255,0,0,1)); /* 標準的語法 */
}
其中rgba()中的4個數字,前3個為顏色rgb,最後1個是透明度,取值0-1,0為透明,1為不透明。

4、網頁設計設置導航裡面這個漸變透明背景怎麼弄?求解。。。

可以用PNG格式的文件

5、請問高手們,網頁設計圖中背景是放射性漸變(不是線性漸變)的情況下,在做成網頁過程中該如何切片

無解,CSS裡面沒有這種背景的解決方式,國外一般的做法是直接把背景作為一張圖片,但由於國內內網路關系,容可以切成幾張,如head一塊,body一塊,footer一塊,沒必要切多了,反而加多請求的,對速度無益。

6、網頁中高度或寬度是1像素的背景漸變圖是怎麼製作的呢?

這個是通過之前的圖片進行設計好的,然後通過代碼、css組織起來的。

7、怎麼設計css網頁背景顏色過渡?

CSS實現漸變背景效果兼容主流瀏覽器
IE瀏覽器下漸變背景的使用需要使用IE的漸變濾鏡filter
對於Firefox瀏覽器下(Firefox 3.6+)漸變背景的實現需使用CSS3漸變屬性 為-moz-linear-gradient屬性
對於webkit核心的瀏覽器,如Chrome/Safari瀏覽器下漸變背景的實現也是使用CSS3 漸變方法為-webkit-gradient
代碼如下:
.gradient{
width:300px;
height:150px;
filter:alpha(opacity=100 finishopacity=50 style=1 startx=0,starty=0,finishx=0,finishy=150) progid:DXImageTransform.Microsoft.gradient(startcolorstr=red,endcolorstr=blue,gradientType=0);/*IE*/
-ms-filter:alpha(opacity=100 finishopacity=50 style=1 startx=0,starty=0,finishx=0,finishy=150) progid:DXImageTransform.Microsoft.gradient(startcolorstr=red,endcolorstr=blue,gradientType=0);/*IE8*/
background:red; /* 一些不支持背景漸變的瀏覽器 */
background:-moz-linear-gradient(top, red, rgba(0, 0, 255, 0.5)); /*Firefox*/
background:-webkit-gradient(linear, 0 0, 0 bottom, from(#ff0000), to(rgba(0, 0, 255, 0.5))); /*Chrome/Safari*/
}
<div class="gradient"></div>

8、如何使用網頁漸變色來提升設計逼格

一、垂直線性漸變

拉漸變是Photoshop的基礎操作,那麼如何運用的好看了?顏色選擇才是關鍵
我們把一個漸變顏色拆分成A B C三個顏色,每個顏色用HSB標注顏色色值。

這是某App的一組引導畫面,運用了三組漸變顏色,分別標注HSB的色值,通過這組色值的變化,分析如下。

A色 B值非常高,普遍50以上
從A色到B色,H值的變化范圍為正負30到70,S值減少10,說明B顏色略變淡。
從B色到C色,H值的變化范圍為正負30到40,S值增加15到50,說明C顏色開始變濃。
以上色值僅供參考,實際使用並非整數。根據以上規律去有規則的使用漸變色。
二、垂直線性漸變+球形漸變
Web界面面積比較大,在大面積使用漸變的時候。如果只是使用垂直的線性漸變是略顯單調的,這個時候我們需要加一個球形的漸變。

A+B+C色構成一個漸變,這時候我們再補充一個D色的球形漸變並高斯模糊。D色的圓形矢量形狀要轉換為智能對象,這樣調節高斯模糊及大小的時候可以無損調整。如果界面上需要運用圖片,我們再補充一個80%透明度的E色,疊加在去色後的圖片上。這樣界面會層次會更加豐富。
三、多角度球形漸變
想讓界面更加絢麗,這時候我們可以考慮多組球形漸變搭配使用。例如最新改版的instagram就是一組線性漸變,加兩組球形漸變組成。球形漸變也是由多組顏色構成。

四、色塊漸變
漸變的顏色不只可以運用在一個色塊上,還可以運用在一組色塊上。設計師運用一組近似性色彩,將每個菜單項清晰區分開,讓界面平衡在一個頻率上,這樣的畫面更有節奏感和舒適性。

9、網頁製作.使用macromedia dreamweaver8怎麼在網頁表格加漸變色的背景

樓上說的很對。

<table style="background: url(背景圖片路徑) " >,

背景圖片可以弄成漸變的。

這樣就行了。

與網頁設計怎麼設置漸變背景相關的知識