css網頁設計的功能設計_簡述css的概念和在網頁設計中的作用

1、CSS樣式在網頁製作中有什麼作用？

樣式表可以很方便的控制網頁表現，比如配色，布局等。
目前老式的採用表格形式的網頁製作方式已經被淘汰了，你看下現在網路上的各大網站，基本全部採用div+css的表現形式了。

2、什麼是css，使用css進行網頁設計有哪些好處

css是英文Cascading Style Sheets的縮寫。它是用來美化網頁內容的，比如給網頁添加背景色或者背景圖片，控制網頁各個地方的字體大小、顏色、字體等。

如給網頁添加一個背景顏色的css代碼為：

background-color:red; //設置背景顏色為紅色

而將段落字體設置為20px藍色雅黑的css代碼為：

p{font-size:20px; color:blue; font-family:Microsoft Yahei;}

3、使用CSS進行WEB設計有哪些優勢？

網頁設計採用DIV+CSS，最大的優勢是實現網頁代碼的標准化，摒棄過時的表格布局方式，實現了內容、表現和行為這3者間的分離，html代碼結構性更好，閱讀和維護更容易，同時網頁文件大小也更小。比如最近給一個客戶的網站重構後，網頁文件大小不到原來的一半，因此佔用更少的網站空間，網站打開速度也更快。

4、html，css，javascript在製作網頁中的作用是什麼？三者之間有何種聯系？

HTML、 CSS、 JavaScript三者的關系
網頁主要由三部分組成：結構（ Structure）、表現（ Presentation）和行為（ Behavior）
HTML —— 結構，決定網頁的結構和內容（「是什麼」）
CSS —— 表現（樣式），設定網頁的表現樣式（「什麼樣子」）
JavaScript（ JS） —— 行為，控制網頁的行為（「做什麼」）

一、 HTML語言
1.1什麼是HTML語言（ HTML概述）
英文全稱： Hyper Text Markup Language
中文全稱：超文本標記語言
HTML 語言是製作網頁的最基本語言，並且只能通過web瀏覽器顯示出來。
Hyper（超）：
用HTML製作的網頁可以通過其中的鏈接從一個網頁「跳轉」至另一個網頁。
Text（文本）：
HTML是一種文本解釋性的程序語言，即它的源代碼將不經過編譯而直接在瀏覽器中運行時被「翻譯」。
Markup（標記）：
HTML的基本規則就是用「標記語言」 ---- 成對尖括弧組成的標簽元素來描述網頁內容是如何在瀏覽器中顯示的。
1.2 HTML文檔結構
HTML文檔一般由兩部分組成：
1. 文檔所要表達的內容信息（文字、圖片等）；
2. 一系列的HTML標簽；
1.3 HTML標簽
1.3.1 什麼是HTML標簽
1. HTML標簽是用 <> 所括住的指令，主要分為：
單標簽： <起始標簽/>
雙標簽： <起始標簽></結束標簽>
例如：
<br/>
<div></div>
2. 通常使用的是雙標簽。有一個起始標簽就對應有一個結束標簽。標簽內容寫在起始標簽和結束標簽之間。
<div>標簽內容</div>
3. 在元素的起始標簽中，還可以包含「屬性」來設置元素的其他特性。一個標簽可以有多個屬性,每個屬性之間用空格隔開。
<div 屬性名="屬性值"></div>
例如：
<div class="wrap" id="wrap"></div>
4. 每一對雙標簽之間可以嵌套，但不能交叉。
正確示例：
<div>
<p></p>
</div>
錯誤示例：
<div>
<p>
</div>
</p>
1.4 編碼器
1.4.1 WebStorm源碼主體標簽含義
<!DOCTYPE> ：
是一個聲明不是 HTML 標簽；它是用來告訴 web 瀏覽器要使用哪個 HTML 版本來對頁面進行編寫。
<html>：
<html>是文檔標識符，它是成對出現的，首標簽<html>和尾標簽</html>分別位於 HTML 文檔的最前面和最後面，明確地表示文檔是以超文本標識語
言（ html)編寫的。該標簽不帶有任何的屬性。
<head>：
<head>標簽用於定義文檔的頭部，它是所有頭部元素的容器。 <head> 中的元素可以引用腳本、指示瀏覽器在哪裡找到樣式表、提供元信息等等。
<meta>：
<meta>標簽位於文檔的頭部，用於定義文件信息，對網頁文件進行說明。其中name屬性主要用於描述網頁，與之對應的屬性值為content， content中
的內容主要是便於搜索引擎機器人查找信息和分類信息用的。
<body>：
<body>標簽用於定義文檔的主體，即在瀏覽器上看到的網頁內容。

5、簡述css的概念和在網頁設計中的作用

CSS是Cascading Style Sheets(層疊樣式表)的縮寫。
是一種對web文檔添加樣式的簡單機制，屬於表現層的布局語言。

1.基本語法規范
分析一個典型CSS的語句：
p {COLOR:#FF0000;BACKGROUND:#FFFFFF}
•其中"p"我們稱為"選擇器"(selectors)，指明我們要給"p"定義樣式；
•樣式聲明寫在一對大括弧"{}"中；
•COLOR和BACKGROUND稱為"屬性"(property)，不同屬性之間用分號";"分隔；
•"#FF0000"和"#FFFFFF"是屬性的值(value)。

2.顏色值
顏色值可以用RGB值寫，例如：color : rgb(255,0,0)，也可以用十六進制寫，就象上面例子color:#FF0000。如果十六進制值是成對重復的可以簡寫，效果一樣。例如:#FF0000可以寫成#F00。但如果不重復就不可以簡寫，例如#FC1A1B必須寫滿六位。

3.定義字體
web標准推薦如下字體定義方法：
body { font-family : "Lucida Grande", Verdana, Lucida, Arial, Helvetica, 宋體,sans-serif; }
字體按照所列出的順序選用。如果用戶的計算機含有Lucida Grande字體，文檔將被指定為Lucida Grande。沒有的話，就被指定為Verdana字體，如果也沒有Verdana，就指定為Lucida字體，依此類推，；
•Lucida Grande字體適合Mac OS X；
•Verdana字體適合所有的Windows系統；
•Lucida適合UNIX用戶
•"宋體"適合中文簡體用戶;
如果所列出的字體都不能用，則默認的sans-serif字體能保證調用;

4.群選擇器
當幾個元素樣式屬性一樣時，可以共同調用一個聲明，元素之間用逗號分隔，：
p, td, li { font-size : 12px ; }

5.派生選擇器
可以使用派生選擇器給一個元素里的子元素定義樣式，例如這樣：
li strong { font-style : italic; font-weight : normal；}
就是給li下面的子元素strong定義一個斜體不加粗的樣式。

6.id選擇器
用CSS布局主要用層"div"來實現，而div的樣式通過"id選擇器"來定義。例如我們首先定義一個層
<div id="menubar"></div>
然後在樣式表裡這樣定義：
#menubar {MARGIN: 0px;BACKGROUND: #FEFEFE;COLOR: #666;}
其中"menubar"是你自己定義的id名稱。注意在前面加"#"號。
id選擇器也同樣支持派生，例如：
#menubar p { text-align : right; margin-top : 10px; }
這個方法主要用來定義層和那些比較復雜，有多個派生的元素。

6.類別選擇器
在CSS里用一個點開頭表示類別選擇器定義，例如：
.14px {color : #f60 ;font-size:14px ;}
在頁面中，用class="類別名"的方法調用：
<span class="14px">14px大小的字體</span>
這個方法比較簡單靈活，可以隨時根據頁面需要新建和刪除。

7.定義鏈接的樣式
CSS中用四個偽類來定義鏈接的樣式，分別是：a:link、a:visited、a:hover和a : active，例如：
a:link{font-weight : bold ;text-decoration : none ;color : #c00 ;}
a:visited {font-weight : bold ;text-decoration : none ;color : #c30 ;}
a:hover {font-weight : bold ;text-decoration : underline ;color : #f60 ;}
a:active {font-weight : bold ;text-decoration : none ;color : #F90 ;}
以上語句分別定義了"鏈接、已訪問過的鏈接、滑鼠停在上方時、點下滑鼠時"的樣式。注意，必須按以上順序寫，否則顯示可能和你預想的不一樣。記住它們的順序是「LVHA」。

6、1.CSS指的是什麼?在網頁製作中為什麼要使用CSS技術? 2.網頁製作中有哪幾種樣式設置方法?各有何特點?

1.css是網頁表現與內容分離的一種樣式設計語言，就比如每個人都有一雙眼睛、兩只耳朵、兩個鼻孔、一個嘴巴，而長的丑的人只是他的面部樣式不符合大眾的審美觀。
2.網站製作中之所以要使用css，是為了讓頁面布局樣式等更加美觀從而吸引更多閱讀者。就好比一個五官精緻的美女大家都愛看一樣！
3.
①行內樣式。例如：<p style="color:red;">樣式</p>(實際效果是p標簽中的字體為紅色)
②內嵌樣式。列如<p class="test">樣式</p> <style>.test{color:red;}</style>(效果同上)
③外聯樣式。列如把代碼 .test{color:red;} 保存在style.css文件中，然後在頁面中引入<link type="text/css" rel="stylesheet" href="style.css" />(效果同上)
（望採納哦！~~）

7、DIV+CSS設計網頁頁面有什麼優點？

（對比傳統的table表格布局）

排版布局好

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

使用DIV+CSS簡單的代碼就能完成表格所不能完成的功能，用CSS給DIV添加屬性值，可以完成各種精準的排版布局。

輕量代碼，訪問速度快

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

DIV排版是使用CSS來定義元素樣式，CSS中簡單的代碼就能實現復雜的樣式定義，所以代碼量要遠遠小於表格中的屬性標簽。這種樣式和內容分離的模式，在瀏覽的時候能夠迅速被載入解析，相比表格的層層嵌套以及生成的大量標簽代碼，DIV確實能夠提升很多瀏覽速度。

搜索引擎更友好

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

直接效果就是排名更容易靠前，在DIV+CSS排版中樣式和主體內容分離，使得搜索引擎蜘蛛抓取頁面內容變得非常輕松，只需對簡潔的代碼進行簡單的抓取分析便可得知網頁的主體內容，從而更有利於網站的(SEO)優化排名。

兼容性好

-----------

使用DIV+CSS設計的頁面布局可以兼容大多數PC瀏覽器，但是由於瀏覽器的版本以及瀏覽器核心等問題會造成部分樣式差異問題，這些問題可以通過CSShack來解決，也就是針對針對不同的瀏覽器去寫不同的CSS，讓它能夠同時兼容不同的瀏覽器，能在不同的瀏覽器中也能得到我們想要的頁面效果。

可維護性好

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

DIV+CSS設計的頁面修改起來比表格布局更加方便，因為在前期的設計中使用了CSS樣式表來控制網站的整體樣式，修改時只需修改一下樣式表裡的公用樣式便可瞬間改動整站風格及布局。改版網站更簡單容易了，不用重新設計排版網頁，甚至於不用動原網站的任何HTML和程序頁面，只需要改動CSS 文件就完成了所有改版。對於門戶網站來說改版就像換件衣服一樣簡單容易。

8、網頁設計採用div+css有什麼好處？

網頁設計採用div+css的好處：
1、div+css有利於搜索引擎爬蟲：一般而言相同網頁頁面html文件table布局位元組大於div+css布局的位元組，所以可以節約搜索引擎爬蟲爬行下載頁面內容時間。
2、重構頁面修改方便（div+css改版方便）：一般DIV+CSS頁面都是html和css文件分開的也就是說一個網頁的內容與表現形式的分離，一般修改小小部分的css文件里css樣式屬性就可以修改真站的樣式版面，如背景顏色、字體顏色、網站寬度等具有table不具備的方便性。
3、div+css頁面增加網頁打開速度：這里是特性決定了他們的性能，因為div+css頁面是div的html和css文件分開的，而瀏覽器打開該網頁的時候是同時下載html和css，所以可以提高網頁打開速度，而table還有個特性就是瀏覽器打開的時候必須是瀏覽器下載以<table>開始,並</table>結束後才顯示該塊的內容，而div的html是邊載入邊將內容呈現到瀏覽器上，div+css網站大大增強用戶體驗作用。大家都知道網頁多等1秒鍾都會降低瀏覽者的等待時間。

導航:首頁 > 萬維百科 > css網頁設計的功能設計

css網頁設計的功能設計

與css網頁設計的功能設計相關的知識