網頁設計直線

1、什麼是web設計中的組件線條顏色

一、 視覺引導功能
視覺引導功能遵循的是一條流暢的路徑，網頁色彩能順利地引導用戶在頁面上移動體驗。
在WEB界面設計中，色彩擔負起和線條、文字一樣的視覺引導和強調的作用。設計師可以充分利用色彩導向作用力量去美化頁面，對重要的信息進行色彩的整合和強化，引導瀏覽者的注意力，有利於推廣新產品。對需要強調的內容適當運用色彩加以突出，使瀏覽者加深記憶，提高網站的信息傳遞效率。在產品展示類型的網頁中，色彩的強調功能尤為明顯。我們在瀏覽一些頁面中不難發現世界頂級護膚品牌HR赫蓮娜的展示頁面，它成功地利用色彩將瀏覽者的注意力引導到產品之上，給人留下深刻的印象。又如在某些商品展示類的網站，色彩的導向傳遞功能運用尤為明顯：亮色系比如以黃色為背景一般所代表的意思是促銷產品熱賣產品，而藍色、褐色或深綠色等冷色調的搭配則多用來表現商品的價值。
二、企業形象識別功能
企業標准色是企業形象識別要素之一，網站設計者將企業網路界面色彩與企業標准色相呼應起到了加深企業形象的作用。格羅佩斯(Walter Gropius)在他的《藝術家與技術家在何處相會》一文中提到「如果物體的形象很適合於它的工作，它的本質就能被人看的清楚明確。」從這里可以很深刻的了解到企業形象在信息傳遞和接納過程當中所起到的非常重要的作用因素。色彩也是形成企業形象的關鍵要素，企業標准色是企業形象的色彩表示系統，人們一看到此色彩就會聯想到該企業。把CI設計這一理念應用到網站整體形象規劃與設計開發上來，以企業CI設計中的標准色作為WEB界面的主色調展開設計，使WEB界面成為企業形象的延伸和宣傳，無疑是把WEB界面設計推向正規化、品牌化發展的道路。它可以使網站與企業具有共通的視覺特徵，便於宣傳和識別，通常達到事半功倍、相得益彰的效果。
百事可樂在全世界擁有較高的知名度，使人過目不忘的藍色和標准字體已成為它的標志。我們可以瀏覽一下百事可樂系列站點，每個網站的主體風格不盡相同，美國總站穩重些，英國站比較活潑，即使站點風格有些差異但都保持了一致的文化特點，都採用了大快藍色的底色，給人以熱情、活力、喜悅的感覺，應用在網路界面設計中，讓受眾群聯想到飲用百事可樂所帶來的快樂心情，無形中就加深了百事可樂品牌在消費者的心目中的形象。
三、 視覺區域劃分功能
WEB界面的首要功能是信息傳遞，色彩正是創造有序的視覺信息流程的重要因素。利用不同色彩設計進行視覺區域劃分是網路界面設計中的常用手法，也是色彩在WEB界面設計中的重要功能。網路界面中的信息不僅數量多，而且種類繁雜，往往在一個頁面中可以看到各種各樣的信息問題，利用色彩分布，可以將不同類型的信息分類排列，並配合相應內容，有針對性地設計色彩；利用各種色綵帶給人的不同心理效果，很好的區分出主次順序，從而形成有序的視覺流程。
色彩的視覺區域劃分功能實用性強，變化性強，靈活易用，適用面廣泛，在信息繁雜豐富的門戶類網站中應用較多，而且效果較為明顯。利用色彩和輔助線把網路界面分成幾個區域，這些區域可以是規則也可以是不規則的，以適應多種信息內容編排的需要。「FDI世界園」是一家招商投資網站，它的網路界面設計十分簡潔，多趣味性。由多種色塊矩形區域拼合成了網路界面的整體框架，用按鈕形式來顯示導航功能選擇，很清晰地把網站的內容分類展示給瀏覽者，配合上網站通用的icon，整個網站十分舒暢，同時減輕的用戶的視覺負擔。
四、審美功能
WEB界面不僅具有實用的物質功能，而且具有審美的精神功能，發揮審美功能的界面形象與發揮實用功能的界面實體是同一的，它們具有同質同構的聯系，網路界面是以一定的使用目的或物質功能為存在前提的，其審美功能必須以其使用目的為導向，即審美功能不能背離其使用目的。由於人的視覺對於色彩有著特殊的敏感性，因此色彩所產生的美感魅力往往更為直接。
色彩既是視覺信息傳達的方式(實用功能)，又是藝術設計的語言(審美功能)，當網路界面的色彩所反映的情趣與人們的審美情緒發生共鳴時，也就是說色彩配合的形式結構與人們審美心理的形式結構相對應時，人們就會感覺到色彩和諧的愉悅。色彩設計對WEB界面設計作品的藝術品位起著舉足輕重的作用，不僅在視覺上，而且在心理作用和象徵作用中都可以得到充分的體現。因此，網路界面設計要以色彩的科學知識為基礎，進而從美學的角度去探討色彩設計的表現形式，增強WEB界面設計作品的藝術性，以創造出更富審美情趣的作品。在國內68design網頁設計的站點，其中國內優秀設計作品中一家叫冰藝工作室的網站還是比較吸引人的眼球，讓人不由自覺的想去點擊它。它每個網路界面所選擇的色彩和圖形都能使瀏覽者自然地將其與產品風格聯系在一起，界面中間色彩和四周部分黑、白、灰無彩色的色調搭配形成了動靜相宜、多樣統一的韻律美，給網路界面注入了活潑而新鮮的活力，從而達成令人賞心悅目的界面形式，和諧中富於變化，具有獨特的創造性和審美價值。
五、品牌語言傳遞功能
品牌宣傳效果不僅應該在視覺上，而且應該在心理上和象徵上得到體會和理解。不同色相具有不同的語意特徵。人們經過長期的社會生產實踐和生活體驗，對色彩形成了不同的情感和心理感受，人們將這種長期積累的色彩印象賦予各種語意特點並將其應用到生產、生活中。
在眾多的網站類型中，不同的網站類型都有自身的色彩語意相關性。如兒童用品的網站設計多使用色彩亮麗、醒目的純色；藍色常用在表現同科技產業等相關新興產業的WEB界面設計上。因此，設計者在界面色彩語言表達中應充分考慮不同色彩的語意特點，並將其和WEB界面主題內容結合起來。
六、主題鮮明功能
網路是信息的海洋，瀏覽者在網路中漫遊無疑是尋找他們所需要的信息資源，網路界面傳遞的信息內容與傳遞方式應該是相互統一的，這是設計作品成功的必要條件之一。網路界面如何使瀏覽者迅速、快捷、准確的掌握主題，整合信息資源，這就需要設計師利用色彩的對比調和手段，產生視覺落差，來表現信息的重點，從而提高瀏覽者獲取信息的效率。設計師可利用不同色彩自身的表現力、情感效應以及審美心理感覺等，使網路界面的內容與形式有機地結合起來，以色彩的內在力量來美化頁面，或含蓄優雅，或動感強烈，或時尚新穎，或單純醒目，烘托主題、突出主題。在網路界面設計的許多成功作品中我們都可以看出這一點。三星galaxys3公司的商業網站，進入該網站的第一需要就是找到所需的產品，WEB界面設計者就利用了產品圖片顯示顏色和灰色塊強烈對比所產生的視覺落差，突出了右上角黑色文字主題內容和產品薄輕便的優勢，以色彩的內在力量引起瀏覽者的重點關注，引導瀏覽者以最便捷的方式使用該網路界面，同時，灰色色塊背景好似深沉的藍色里的交音階，高貴、氣質不凡，鋪色用心，恰到好處，使網站風格突出，大大增強了網站的藝術性和吸引力，從而提高了網站的知名度。

2、在html靜態頁面中，用哪個標簽插入一條直線？

使用<hr />標簽可以插入一條直線。

3、word，dreamweaver或做網站的高手請進。。。。求帶線條的排版效果

您說的這個是設計網頁上的吧？ 具體實現方法：
1、用圖形處理軟體（如photoshop）做一個橫線的圖，必須注意圖的高度（如28像素），然後在最底畫一橫線；
2、在網頁適當位置建一個表格，設置各行高度也同上圖的高度（如28像素），然後設置表的背景圖為上述的圖；
3、然後在此表中輸入文字即。

================================
如果你覺得用做表格各行輸入文字不方便，那麼就：
1、先把此文章內容輸入到一個大的單元格中，並調整行高（一些網頁設計軟體都可以設置行間距的；
2、根據行間距和字體大小，就可以確定每一行的高度了。
3、然後在用圖形處理軟體（如photoshop）做一個帶橫線的圖，如上述方法。

這兩種方法我都用過，效果很好。

================================

源碼？ 哪個網頁沒有源碼？我做的網站都是編制好從後台去控制的，無論靜態還是動態的。您是指動態網頁吧？
要是動態網頁，更好辦了，直接做一個母版或叫樣式就行了，然後把需要的文字插入，全OL。

4、jsp頁面中如何顯示一條橫線....

<p>hr控制

<!-- width控制線的長度size控制線的粗細 -->

橫線：<hr width=500 size=0 color="#999999">

<!-- width控制線的寬度，size控制線的長短 -->

橫線<br><div style="position:relative; width:600; height:1px; background-color:red"></div>

<div style="background:#fff;

text-align: center;

margin:0 auto;

margin-bottom:-18px;

width: 90px;

position:relative;

">XXXXXXXXX</div><hr/>

(4)網頁設計直線擴展資料

在網頁中畫一條豎線

1<div style="width:1000;height:1;;border-top:1px dotted #000000"></div>2<s 

style="width:1000;height:1;border-top:1px dotted #000000"></s>3<b 

style="width:1000;height:1;border-top:1px dotted #000000"></b>4<input 

style="width:1000;height:1;border-top:1px dotted #000000">5<a 

style="width:1000;height:1;;border-top:1px dotted #000000"></a>6<center 

style="width:1000;height:1;;border-top:1px dotted #000000"></center>7<iframe 

style="width:1000;height:1;;border-top:1px dotted #000000;" frameborder=no>

</iframe>8<img style="width:1000;height:1;;border-top:1px dotted #000000">

</img>9<hr size="1" noshade style="height:100;width:1;border:1px dotted 

#000000;zoom:2">線條長度=zoom*height10<hr size="1" noshade style="border:1px 

dotted #000000">部分不能顯示請裝IE5.5+

5、網頁設計 裡面的線條是怎麼畫的？

有的是畫的，有的是表格，線條粗細是可以在屬性那改的

6、（分）電腦繪畫，電腦動畫，電子報刊，網頁設計，怎麼弄？

一、在草紙上設計封面。

二、建立一張空白幻燈片，頁面設置為「縱向」，「背景色」「填充效果」設置為「雙色（顏色自定）」。

三、使用矩形工具：

1、畫一矩形，比頁面略小，無填充色，彩色實線。

2、畫一細長矩形，橫向，無線條色，填充色為白色，長度與頁面寬度一致，位置在頁面中間偏上；再復制一個細長矩形，向下移動靠近第一個舉行下邊。

3、用第2步方法畫一縱向矩形，無線條色，填充色為白色，高度與第2步中兩矩形距離相同，靠近第一個矩形左邊，置於第2步中兩矩形中間；再復制一個矩形置於頁面中間偏右位置。

四、插入藝術字：式樣自定，以整體效果美觀為標准。

1、插入大號藝術字「芳草地」，作為報刊名稱。

2、插入紅色粗環形藝術字「教師節特刊」置於左上角。

3、插入藝術字「FANGCAODI·JIAOSHIJIETEKAN」置於第一個矩形下邊處。

4、插入藝術字「2005」和「第九期」，使二者上下排列，中間畫一直線。置於「芳草地」右下方。

五、插入文本框：

1、插入文本框「本期導讀」，無線條顏色，填充色為紅色。

2、在「本期導讀」下方插入豎排文本，使用「項目符號」，輸入主要文章標題。置於「三、2」矩形下、「三、3」第二個矩形與「三、1」矩形右邊之間。

3、插入文本框「增長知識 拓寬視野」，置於「三、2」矩形之上靠近左端；插入豎排文本「小學生自己的讀物」，置於「三、3」第一個矩形左邊靠近下端。

六、插入圖片：

插入……圖片……來自文件，插入一幅能夠體現報刊主題的圖片，調整大小，裁剪掉不需要部分，置於「三、2—3」四條矩形框圍成的矩形中，疊放次序置於底層。

七、對插入的矩形、藝術字、文本框進行調整。

第二章 製作扉頁

一、插入一個文本框，無填充色，線條格式設置為粗細線，黑色，6磅，比頁面略小（留邊）。文本框內插入文字內容，調整文字大小、行距、字距等填滿文本框。插圖可以繪制或從剪貼畫和其它位置插入。

二、插入兩個文本框「FANGCAODI·JIAOSHIJIEGEKAN」、「2005/第9期」，分別置於正文文本框頂端左、右兩端。將二者組合，方便復制到其它頁面中。

三、製作頁號和鏈接按鈕，置於頁面右邊下端。

1、利用繪制一個小圓形，插入文本「1」，作為頁號。

2、在頁號下面畫一個縱向長矩形，直到頁下邊，無線條顏色，填充色為蘭色。

3、在在蘭色矩形上半部畫一個縱向長矩形，無線條顏色，填充色為粉紅，寬度是蘭色矩形的1/2。

4、在粉紅矩形左邊插入一個與之同樣大的豎排文本「芳草地·教師節特刊」，文本框無線條顏色，填充色為白色。

5、在粉紅矩形和豎排文本框下邊繪制一橘色矩形，無線條顏色，比粉紅矩形略寬，置於頁邊。

6、在橘色矩形上插入5個同樣大的縱向圓角矩形（自選圖形……基本形狀，可用復制的方法），線條黑色，填充綠色；分別添加文字「封面」「上頁」「下頁」「目錄」「封底」。

7、將「三1—6」繪制的圖形和插入的文本框組合。方便復制到其它頁面中。

第三章 製作目錄頁

一、安排版面

將版面劃分為三部分。右邊約佔三分之二的部分，用於目錄內容；左邊上面約三分之二用於標題，下面插入一張圖片和文本框，錄入刊物的編輯者等信息。

二、錄入與排版

1、插入橫向長條形矩形，無線條顏色，填充墨綠色，置於頁面頂端。

2、插入縱向矩形，線條為墨綠色虛線，無填充顏色，置於右邊，作為目錄內容區域。

3、模仿第二章第三步介紹的方法，插入頁號和鏈接按鈕，置於左上部，縱向長條形。

4、插入藝術字「芳草地·」和「教師節特刊」，縱向，分別設置不同式樣，置於鏈接按鈕條右邊。

5、插入圖片「機器人」，置於標題下方，大小適中。

6、在圖片下插入文本框，無線條和填充顏色，錄入責任編輯、指導教師、發行者、出版社、聯系方式等。

在標題右下方插入文本框，錄入期刊號。

7、在標題所佔區域上部右邊插入矩形和三角形，並合並為向下的箭頭形狀，矩形內錄入「目錄」，或插入藝術字。圖形填充為墨綠色，無線條色。

8、在目錄內容區內插入多個文本框（每個欄目標題和文章標題分別佔用一個文本框，逐個插入或復制），欄目文本框設置為無線條色，填充墨綠色；文章標題文本框設置為無線條和填充色。

第四章 製作內容頁

一、根據需要設置頁面背景色。

二、將第二章中製作的頁眉和頁號、鏈接按鈕條復制後粘貼到第四張幻燈片及第一張內容頁中相同的位置。在頁眉下和頁腳處分別繪制一條直線，設置為淡蘭色、雙線，並將其與頁眉、頁號與鏈接按鈕條合並。並將它們復制到以後製作的內容頁中。

三、插入文本框輸入第一篇文章內容，如果要分欄則每欄插入一個文本框，注意調整每個文本框的大小及內容多少。

四、在預留區域內插入圖片，標題可插入藝術字。

五、用同樣的方法，完成第二篇文章的錄入和排版設置工作。如果需要底色和線條，可按版面需要進行設置。比如設置文本框的線條顏色、式樣，填充顏色。並非文章周圍都出現線條時可單獨插入直線後對顏色、粗細、式樣進行設置。

六、製作其它內容頁。

第五章 製作封底頁

一、設置頁面背景色，設置為雙色，上部為粉紅、下部為土黃色。

二、將封面中製作的環行藝術字「教師節特刊」和用作無填充色的大矩形幾兩個橫向的白色矩形復制到此。

三、將兩個矩形設置為白色線條、填充綠色，並將上面舉行適當上調。

四、在藝術字「教師節特刊」下插入弧形藝術字「芳草地」，設置為白色，其下插入文本框「2005.9」，右邊靠下一點插入文本框「責任編輯和審訂」，仍為白色。

五、在靠近下邊出插入文本框，錄入出版者和出版日期，分別安排到靠近頁面左右兩邊處。

六、完成相關鏈接的設置和目錄頁的分頁工作。

七、放映觀看製作完成的電子報刊，並作出適當調整和設置。

第六章 深入了解繪圖工具

Powerpoint的繪圖工具功能自然無法與專業的繪圖工具相提並論，但如果恰倒好處的使用卻會使你製作的電子報刊增色不少，當然，同樣可以使你製作的Powerpoint課件更加美觀。

1、自選圖形。為我們提供了一些常用的線條型圖片，可以很方便地插入，為我們節省繪制所需要的大量時間，並且這些圖形可以旋轉、設置線條和填充顏色、相互組合。

2、直線工具。繪制的直線可以設置其顏色、虛實、線型、粗細、箭頭、旋轉、組合。可以用作文章分欄的線條。

3、箭頭工具。

4、矩形工具。按住SHIFT鍵可以繪制正方形。矩形可以很方便地用作報刊封面的線條。

5、圓形工具。按住SHIFT鍵可以繪制圓形，否則，繪制橢圓形。

對於繪制出的矩形和圓形，不同的線條顏色和填充效果可以使你的電子報刊增色不少。

6、藝術字工具。單擊插入的藝術字，藝術字工具條就會出現，利用該工具可以很方便地編輯文字、設置藝術字的式樣、格式、形狀、文字環繞方式、間距等。

7、三維效果樣式。可以很方便地設置圖片的三維效果樣式。

7、網頁設計如何插入水平線

在Dreamweaver里有以下辦法：
1、設計視圖，點插入菜單-HTML-水平線，或者在代碼視圖，直接輸入<hr>即可；
2、插入一個高度為1px的表格或div，一定要刪除空格符 ，div的話還要設置超出隱藏；
3、可以用CSS：border-bottom:1px solid #ccc;
4、可以用插入一個直線圖片

8、在html靜態頁面中，使用哪個標簽插入一條直線

HTML <hr> 標簽 定義和用法 <hr> 標簽在 HTML 頁面中創建一條水平線。水平分隔線（horizontal rule）可以在視覺上將文檔分隔成各個部分。 http://www.w3school.com.cn/tags/tag_hr.asp 具體用法和可用屬性看這個地方。

9、請問在網頁製作中加入一條水平線的HTML代碼是什麼？

網頁中製作一條水平線的HTML代碼有以下的方法可以實現：

1.使用html中的border屬性來設置一條水平線

<div style="width:500px; border:1px solid red;"></div><!--復制到html文件中就會是一條紅色水平直線，線的顏色、長短、可自己調節--> 

2.使用hr標簽可以製作一條水平直線

<hr/>

3.使用background-color來製作一條線，和border基本類似

<div style="width:500px; height:1px;background-color:red;"></div><!--復制到html文件中就會是一條紅色水平直線，線的顏色、長短、可自己調節--> 

4.可利用背景圖來實現和background-color原理一樣

<div style="width:500px; height:1px;background:url(背景圖的路徑) repeat-x;"></div><!--復制到html文件中就會是一條紅色水平直線，線的顏色、長短、可自己調節--> 

10、如何在HTML中設計<hr>即水平線的顏色？？

在HTML中設計水平線的方法如下

1  在網頁設計過程中，如果隨意利用預設水平線，常常會出現插入的水平線與整個網頁顏色不協調的情況。打開水平線屬性面板也只有寬、高、對齊以及陰影方面的設置。

2，對水平線顏色的設置，怎麼辦? 其實，你只要仔細看一下水平線的屬性設置面板，就會發現一個「快速標簽編輯器」，點擊此標簽並在後面輸入color=顏色。這里的「顏色」可以是任何顏色，一般格式為：< hr color=#FF0000>。

3，用這個方法設置後，在Dreamweaver中無法直接看到效果，我們可以點擊「F12」鍵，在瀏覽器里瀏覽水平線的顏色變化。 

最後，再告訴你個小技巧

諸如「#FF0000」這樣的顏色代碼對於初級朋友來說不容易分辯，你可以這樣做：給網頁中的字體加上顏色此顏色是你想給水平線所要加的顏色，然後把顏色代碼復制並粘貼到水平線的「快速標簽編輯器」即可。