網頁設計優先順序_跪求高手指點:如何給網站頁面信息歸類排列優先順序如何架構一個頁面、一個網站

1、HTML中嵌入CSS的四種方式及優先順序，如何選擇

1. 行內樣式

行內樣式就是把 CSS 樣式直接放在代碼行內的標簽中，一般都是放入標簽的style屬性中，由於行內樣式直接插入標簽中，故是最直接的一種方式，同時也是修改最不方便的樣式。

<p style="background-color: #999900">行內元素，控制段落-1</p>
<h2 style="background-color: #FF6633">行內元素，h2 標題元素</h2>
<p style="background-color: #999900">行內元素，控制段落-2</p>
<strong style="font-size:30px;">行內元素，strong 比 em 效果要強</strong>
<div style="background-color:#66CC99; color:#993300; height:30px; line-height:30px;">行內元素，div 塊級元素</div>
<em style="font-size:2em;">行內元素，em 強調</em>2. 內嵌式

內嵌式通過將 CSS 寫在網頁源文件的頭部，即在 <head> 和 <head> 之間，通過使用 HTML 標簽中的 <style> 標簽將其包圍，其特點是該樣式只能在此頁使用，解決行內樣式多次書寫的弊端。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>內嵌式</title>
<style type="text/css">
p{
text-align: left;  /*文本左對齊*/
font-size: 18px;  /*字體大小 18 像素*/
line-height: 25px;  /*行高 25 像素*/
text-indent: 2em;  /*首行縮進2個文字大小空間*/
width: 500px;  /*段落寬度 500 像素*/
margin: 0 auto;  /*瀏覽器下居中*/
margin-bottom: 20px;  /*段落下邊距 20 像素*/
}
</style>
</head>
<body>
<p>「百度」這一公司名稱便來自宋詞「眾里尋他千百度」。（百度公司會議室名為青玉案，即是這首詞的詞牌）。而「熊掌」圖標的想法來源於「獵人巡跡熊爪」的刺激，與李博士的「分析搜索技術」非常相似，從而構成百度的搜索概念，也最終成為了百度的圖標形象。在這之後，由於在搜索引擎中，大都有動物形象來形象，如 SOHU 的狐，如 GOOGLE 的狗，而百度也便順理成章稱作了熊。百度熊也便成了百度公司的形象物。</p>
<p>在百度那次更換 LOGO 的計劃中，百度給出的 3 個新 LOGO 設計方案在網民的投票下，全部被否決，更多的網民將選票投給了原有的熊掌標志。</p>
<p>此次更換 LOGO 的行動共進行了 3 輪投票，直到第 2 輪投票結束，新的笑臉 LOGO 都占據了絕對優勢。但到最後一輪投票時，原有的熊掌標志卻戲劇性地獲得了最多的網民選票，從而把 3 個新 LOGO 方案徹底否決。</p>
</body>
</html>3. 鏈接式

鏈接式通過 HTML 的 <link> 標簽，將外部樣式表文件鏈接到 HTML 文檔中，這也是網路上網站應用最多的方式，同時也是最實用的方式。這種方法將 HTML 文檔和 CSS 文件完全分離，實現結構層和表示層的徹底分離，增強網頁結構的擴展性和 CSS 樣式的可維護性。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link href="lianjie.css" type="text/css" rel="stylesheet" />
<link href="lianjie-2.css" type="text/css" rel="stylesheet" />
</head>
<body>
<p>我是被 lianjie-2.css 文件控制的，樓下的你呢？？</p>
<h3>樓上的，<span>lianjie.css</span> 文件給我穿的花衣服。</h3>
</body>
</html>4. 導入樣式<style type="text/css">
@import url=("css路徑名");
</style>

這種方法一般不用，可以直接忽略。

一般都是採用鏈接樣式，行內樣式和內嵌樣式維護起來相對麻煩，

優先順序(從高到底)

行內樣式>內嵌樣式>鏈接樣式>導入樣式。

2、網頁製作中如何使兩個重疊在一起的FLASH顯示有優先順序

使用層
層有優先順序的概念的，你可以把要優先顯示的FLASH顯示在前面的層上。
FLASH支持透明顯示設置，手動修改下HTML代碼即可，或者發布的時候直接發布成背景透明的。

3、計算機，網頁設計中CSS各選擇器的含義，用途和不同，尤其是復合內容選擇器？

1元素選擇器
HTML文檔的元素名稱就是元素選擇器。 1）語法，例如：html<color:black;>、h1{color:blue;}、p{color:silver;} 2）缺點：不同的元素樣式相同，即不能跨元素。所以做不到同一類元素下的細分。

2類選擇器
自定義的某種選擇器。 1）語法：.className{樣式聲明} 例如：.myClass{ background-color:pink;font-size:47px; } <h2>h2中的文本</h2> <p>p中的文本</p>
注意事項：
html文件中，所有元素都有一個class屬性，如：<p></p>
類選擇器還一種用法：<div id="d1"class="s1 s2">hello</div>，樣式s1和樣式s2對div共同起作用。

3分類選擇器
將類選擇器和元素選擇器結果起來使用，以實現同一類元素下不同樣式的細分控制。如<input>元素，又有按鈕又有文本框的，採用分類選擇器。 1）語法：元素選擇器.className{樣式聲明} 例如： p.myClass{ color:red;font-size:27px } <h2>h2中的文本</h2> <p>p1中的文本</p> <p>p2中的文本</p>

4元素id選擇器
以某個元素id的值作為選擇器。比較特殊的、頁面整體結構的劃分一般使用id選擇器。 1）語法：定義id選擇器時，選擇器前面需要有一個「#」號，選擇器本身則為文檔中某個元素的id屬性的值。例如：#header{ color:red;background:yellow; } <h1 id="header">This is Title<h1>
u 注意事項：
v html文件中，所有元素都有一個id屬性。且某個id選擇器僅使用一次。

5派生選擇器
依靠元素的層次關系來定義。某一包含元素下的一些相同子元素使用派生選擇器。 1）語法：通過依據元素在其位置的上下文關系來定義樣式，選擇器一端包括兩個或多個用空格分隔的選擇器。例如：h1 span{color:red;} <h1>This is a<span>important</span>heading</h1>

6選擇器分組
對某些選擇器定義一些統一的設置（相同的部分）。 1）語法：選擇器聲明為以逗號隔開的元素列表。例如：h1,p,div{ border:1px solid black;}

7偽類選擇器
偽類用於向某些選擇器添加特殊的效果。 1）語法：使用冒號「：」作為結合符，結合符左邊是其他選擇器，右邊是偽類。 2）常用偽類：有些元素有不同的狀態，典型的是<a>元素。 ①:link：未訪問過的鏈接 ②:active：激活 ③:visited：訪問過的鏈接 ④:hover：懸停，滑鼠移入，所有元素都能用 ⑤:focus：獲得焦點例如：a:link{ color:black;font-size:20px; } a:visited{ color:pink;font-size:20px; } a:hover{ font-size:27px; } a:active{ color:red; }

8選擇器優先順序
1）基本規則：內聯樣式 > id選擇器 > 類選擇器 > 元素選擇器
2）優先順序從低到高排序：
div < .class < div.class < #id < div#id < #id.class < div#id.class 例如：<div id="id" style="color:black;"></div>

4、css選擇器有哪些？各種選擇器優先順序大小順序

CSS選擇器如下：
1. 標簽名選擇器 div { color：Red;} /即頁面中的各個標簽名的css樣式
2.類選擇器 .divClass {color:Red;} /即定義的每個標簽的class 中的css樣式
3.ID選擇器 #myDiv {color:Red;} /即頁面中的標簽的id
4.後代選擇器（類選擇器的後代選擇器） .divClass span { color:Red;} /即多個選擇器以逗號的格式分隔命名找到准確的標簽
5.群組選擇器 div,span,img {color:Red} /即具有相同樣式的標簽分組顯示
選擇器的優先順序
1.最高優先順序是 (直接在標簽中的設置樣式，假設級別為1000)<div style="color:Red;"></div>
2.次優先順序是（ID選擇器 ,假設級別為100） #myDiv{color:Red;}
3.其次優先順序是（類選擇器，假設級別為10） .divClass{color:Red;}
4.最後優先順序是（標簽選擇器，假設級別是 1） div{color:Red;}
5.那麼後代選擇器的優先順序就可以計算了啊
比如 .divClass span { color:Red;} 優先順序別就是：10+1=11

5、網頁美工與UI設計區別是什麼??

非業內人士總習慣用「美工」稱呼UI設計師，而設計師通常會為此感到生氣。畢竟，在國內大部分人對UI的理解還停留在美術設計方面，認為UI的工作只是描邊畫線，缺乏對用戶交互重要性的理解。實際上，這兩個職業有著巨大差異。今天我們就為各位UI設計師正名，來聊聊「美工」與「UI設計師」的區別。01從工作性質來看美工這個稱呼，本來的職業是：網站美術設計、平面美術設計，也就是我們稱之為：平面設計師或網路設計師。這裡面分的更細的是，平面設計師一般做logo設計、VI手冊、印刷品等，網路設計師一般是指自己能獨立完成網站，包括代碼的設計師。UI即User Interface（用戶界面）的簡稱。泛指用戶的操作界面，包含移動APP，網頁，智能穿戴設備等。互聯網新科技興起，從國外引進了UX設計師的概念，但是公司內部協作分的更細，分為了：UI設計師（視覺）和UE設計師(交互），設計師徹底告別了代碼，更專注於我們所說的：用戶體驗。02從服務群體來看1、美工美工服務的是甲方客戶，作品是否可以通過，全靠甲方一句話。偏偏每個人的審美都不同，你辛辛苦苦做出來的未必就能讓甲方喜歡。漸漸地，美工的主動權開始被剝奪，離自主創作越來越遠，只是用軟體做出好看的東西，這更像是一名素材的搬運工。2、UI設計師UI設計師面向的是產品使用者（用戶），由於用戶的留存會決定產品的生死，所以他們要聽的是用戶的話。即使上層領導與你的審美有很大差別，但也決不敢拿產品的命運打賭。用戶留存數據、內測用戶的反饋等是你做產品迭代的原因所在。甚至有時候，漂亮、充滿創意的界面產生的效果反而比較差。03從工作流程來看1、美工接到老闆需求，開始做設計，初稿過後根據老闆的意見修改設計，改完後接著根據老闆的意見修改……大家還記得曾經的網路熱詞——五彩斑斕的黑嗎？2、UI設計師在開展設計產品UI之前，我們應當根據功能的優先順序或者相關調研數據，結合常規設計原則來建立應用的界面交互框架，即交互線框圖。交互線框圖須對零碎且尚未流程化的功能信息進行歸納和整理，首先要交代應用中都有什麼東西，並設計合理的信息結構，明確這些元素的具體位置，最後再詳細描述用戶與界面元素之間的交互行為，包括如何操作以及相應的操作反饋、跳轉路徑等。04從掌握技能來看1、美工UI設計和美工兩者有什麼區別？
愛吃奶茶的皮卡丘
與其持劍天涯，不如浪跡江湖
非業內人士總習慣用「美工」稱呼UI設計師，而設計師通常會為此感到生氣。畢竟，在國內大部分人對UI的理解還停留在美術設計方面，認為UI的工作只是描邊畫線，缺乏對用戶交互重要性的理解。實際上，這兩個職業有著巨大差異。今天我們就為各位UI設計師正名，來聊聊「美工」與「UI設計師」的區別。01

從工作性質來看美工這個稱呼，本來的職業是：網站美術設計、平面美術設計，也就是我們稱之為：平面設計師或網路設計師。這裡面分的更細的是，平面設計師一般做logo設計、VI手冊、印刷品等，網路設計師一般是指自己能獨立完成網站，包括代碼的設計師。

UI即User Interface（用戶界面）的簡稱。泛指用戶的操作界面，包含移動APP，網頁，智能穿戴設備等。互聯網新科技興起，從國外引進了UX設計師的概念，但是公司內部協作分的更細，分為了：UI設計師（視覺）和UE設計師(交互），設計師徹底告別了代碼，更專注於我們所說的：用戶體驗。

02從服務群體來看

1、美工

美工服務的是甲方客戶，作品是否可以通過，全靠甲方一句話。偏偏每個人的審美都不同，你辛辛苦苦做出來的未必就能讓甲方喜歡。漸漸地，美工的主動權開始被剝奪，離自主創作越來越遠，只是用軟體做出好看的東西，這更像是一名素材的搬運工。2、UI設計師

UI設計師面向的是產品使用者（用戶），由於用戶的留存會決定產品的生死，所以他們要聽的是用戶的話。即使上層領導與你的審美有很大差別，但也決不敢拿產品的命運打賭。用戶留存數據、內測用戶的反饋等是你做產品迭代的原因所在。甚至有時候，漂亮、充滿創意的界面產生的效果反而比較差。

03從工作流程來看

1、美工接到老闆需求，開始做設計，初稿過後根據老闆的意見修改設計，改完後接著根據老闆的意見修改……大家還記得曾經的網路熱詞——五彩斑斕的黑嗎？2、UI設計師

在開展設計產品UI之前，我們應當根據功能的優先順序或者相關調研數據，結合常規設計原則來建立應用的界面交互框架，即交互線框圖。交互線框圖須對零碎且尚未流程化的功能信息進行歸納和整理，首先要交代應用中都有什麼東西，並設計合理的信息結構，明確這些元素的具體位置，最後再詳細描述用戶與界面元素之間的交互行為。

6、網站設計要遵循哪些原則？

1、響應式布局：自適應PC、手機、平板端，網站的可訪問性非常重要，越來越多的人使用手機搜索訪問網站；
2、安全穩定：網站從本質上來說一款軟體，是軟體都會需要升級，因此使用專業的建站系統搭建網站除了功能完善，還可以在線升級
3、尊重知識產權：當前很多所謂的定製建站公司為了節省成本或受限於自己的技術水平，模仿抄襲建站行業的標桿企業模板或是模仿同行，從而會給公司埋下嚴重的侵權法律風險。

7、如何提升網頁設計的視覺層次感

1. 明確元素設計目標
網頁上的各項元素通常都有其存在的目的和意義，在構建視覺層次時我們就可以從這方面著手，根據網頁元素的不同角色確定優先順序，然後進行視覺層次的構建。
2. 考慮用戶瀏覽模式
當用戶初次訪問網站時，他們一般不會仔細瀏覽所有內容，而是會進行快速的掃視，確定其中是否有自己感興趣的內容。
3. 功能性優先
我們常常會有這樣一個誤區，認為視覺層次是服務於網站設計美感的。其實，視覺層次設計的功能性反而要更重要一些。設計師在構建視覺層次時首先需要確保每個元素發揮了自己的作用，比如提供給用戶清晰的導航菜單、可見的購買途徑等，然後再考慮元素組合的界面美觀與否。
4. 善用留白
留白或者說負空間，不僅僅是指界面元素之中空白的區域，它更是視覺層次構成的核心元素之一。在視覺層次設計中，留白一方面可以用來聯系或區分不同內容元素，創造別具一格的布局。另一方面它還可以幫助強調某個關鍵元素，讓它獲得用戶額外的關注。
5. 使用黃金分割
黃金准則主要是指1:1.618的頁面比例，它被公認為是最具美感的，在自然界、日常生活、舞檯布局等多個方面都有著不同的應用。

8、網頁製作 javascript中與或非的優先順序是什麼？

優先順序：非>與>或
例如
if( !a&!b || !c&d ){
// (a、b為false) 或者 (c為false，d為true )

};

9、怎麼樣的網頁設計才是最好的

先學一學HTML，找本自己能看懂的教材，瀏覽為主，不用記住所有的概念，只要記住使用原理就行了，這一階段，估計三天就夠了；然後用兩天時間學CSS，方法同上；進而再花些時間了解一下JavaScript。然後就可以用記事本嘗試寫幾個網頁，記住這時千萬不要用那些可視化工具，比如FrontPage、Dreamweaver（那些以後再學）。有一個提高自己「寫網頁」的捷徑，就是上各大網站，把網頁保存下來（什麼？你說你不會保存網頁？就是「文件→另存為」），然後打開保存下來的網頁，點擊右鍵→查看源文件，看看人家的網頁是怎麼寫的，然後模仿他們的寫法，不斷規范自己的代碼。嘿嘿，這個方法不錯吧。先好好模仿一下吧。接下來該學一下Fireworks了。建議一開始就到網上找些實例教程，這些實例教程一般都介紹得很詳細，跟著它一步一步做下來，每學會一個實例就掌握了幾項操作，而且也有了自己的作品，很有成就感的，長期積累下來對自己的提高很有幫助。學Fireworks主要是學圖片處理，比如加一些效果，還有很重要的就是切圖，這對於初學者是很重要的。這時還可以結合Dreamweaver進行學習，你就可以體會到Dreamweaver和Fireworks的無縫集成了。利用這些工具多做幾個網頁，你就可以達到一定水平了。要是想讓你的網頁多一些炫目的效果，建議你學一下Flash，難度並不大，而且要是前面的JavaScript基礎打得好的話，學到Flash中ActionScript時，你會有一種似曾相識的感覺，因為這兩種語法幾乎是一模一樣的。到這時，相信你就可以真正領會到「網頁三劍客」的威力了。在實踐中不斷提高要是每天能拿出兩個小時來學習，完成以上這些學習估計只要20天就差不多了。要是天賦高的話（比如說像我這樣的，呵呵)，那需要的時間就更少了。接下來該實習了，找個地方鍛煉一下自己，比如可以去一些公司乾乾兼職，或是給自己的單位設計一下主頁等。最好是能進入一個正規的開發團隊，你就會學會如何以團隊合作的方式開發網站，特別是怎樣和程序組合作，把頁面與後台程序資料庫配合起來。可能你會擔心自己是新手，人家會嫌棄你，沒關系，只要努力去找，總會有機會的。到此，你就基本可以稱作是一個「准Web Designer」了，不過要從根本上提高自己，最好去學學美術，這是當一個網頁設計師的基本功。

10、跪求高手指點:如何給網站頁面信息歸類排列優先順序？如何架構一個頁面、一個網站？

導航:首頁 > 萬維百科 > 網頁設計優先順序

網頁設計優先順序

與網頁設計優先順序相關的知識