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网页设计的功能设计相关的知识