-DIV+CSS入门教程完整篇.doc

第一章：应知道
1.1 DIV+CSS的叫法是不准确的
我想凡是来到“这个专题”的同学，很大部分是冲着DIV+CSS来的，目的就是学习DIV+CSS的，说的再直接一些就是学习如何用DIV+CSS布局页面，如何从一张图片制作成标准的DIV+CSS页面。
如果你看完第一段还没有发现错误的话，那你就很有必要，接着往下看。
DIV+CSS这种叫法其实是一种很错误的叫法，这是国人一厢情愿的叫法，而标准的叫法是什么呢？
呵呵，没错，是xHTML+CSS，不理解吧，我来细细给你说，如果下面的你能理解，保证面试的时候会有很大的帮助，同时也可以让你后面的学习更轻松。
为什么国人将这种页面布局的方法叫做DIV+CSS？
因为过去布局页面基本上都是用Table布局，也可以说是Table+CSS，而现在布局页面呢，用DIV，所以叫DIV+CSS，听起来也挺合理，认为这样布局出来的页面也就是标准页面，甚至有些人走了个极端，看到其他网站用到Table，就会嘲笑页面做的不够标准，好似用不用Table成为了页面是否标准的一个标尺。现在我可以告诉大家，凡是有着这种行为的，都学得不咋样，很皮毛！
用了Table页面就不标准了?!纯粹无稽之谈，那什么才是标准页面呢？先看一个专业概念，WEB标准，然后我会问三个问题，你来回答：
WEB标准不是某一个标准，而是一系列标准的集合。网页主要由三部分组成：结构（Structure）、表现（Presentation）和行为（Behavior）。对应的标准也分三方面：结构化标准语言主要包括XHTML和XML，表现标准语言主要包括CSS，行为标准主要包括对象模型（如W3C DOM）、ECMAScript等。这些标准大部分由W3C起草和发布，也有一些是其他标准组织制订的标准，比如ECMA（European Computer Manufacturers Association）的ECMAScript标准。
看明白了没有？问题来了~先不要看答案，从上面的概念中找出
问题一：WEB标准有几部分组成
问题二：结构化标准语言是什么？
问题三：表现标准语言是什么？
答案一：三部分，结构、表现、行为
答案二：XHTML和XML
答案三：CSS
看完上面三个问题，哪什么是标准页面呢？呵呵，说白了就是按照WEB标准制作的页面，从第二个问题和第三个问题中，我们又可以说，用XHTML和CSS制作的页面就是标准页面，也就是说xHTML+CSS制作的页面就是标准页面。怎么样，理解了吧
为什么不说XML+CSS呢？
很简单，因为XML过于复杂，且当前的大部分浏览器都不完全支持XML。所以就不用它来布局页面喽~
既然xHTML+CSS制作页面就是标准页面了，又因为xHTML中不只有DIV标签，还有span、p、a、ul、li、dl、dt、dd….，即使我不用DIV，用其他标签(比如:ul、li)制作出来的页面也是标准页面！所以说用DIV+CSS来制作标准页面这句话就很狭隘喽~如果满屏全部都是DIV那也算不上标准页面，曾经由一个朋友告诉我，说他的页面全部用的DIV，每个模块，每个功能区域，就连一条线都是纯DIV实现，并且相当自豪的告诉我，没有人比他做的页面更标准的了，他不但对WEB标准页面的理解有差错还犯了一个很大的错误，xHTML中的每一个标签都有其作用，各司其职，各守其责，要用的恰到好处，这才算是标准页面，DIV不是万能的哟~！
说到这里大家应该明白，这种Web2.0时代的布局页面的方法，叫DIV+CSS是不准确的，应该叫xHTML+CSS。
凡是看到这节的同学们，以后尽可能说xHTML+CSS，不要再说DIV+CSS喽，如果非要说，也要加上一句说明哟，比如
面试官：你对DIV+CSS了解么？
应聘者：DIV+CSS准确的说应该叫xHTML+CSS，我对这种页面布局方法非常了解！……
第二章
使用Table布局页面为什么是不明智的？
大家看到标题，不要误解认为在页面中不能使用Table，而是可以使用Table，但是尽量不要用Table去布局页面，为什么这么说呢，因为使用Table布局页面会使页面失去灵活性，怎么个灵活法呢，比如今天你好不容易做出来的页面，第二天老板说我不喜欢登录模块放到右边，还是放到左边，通知板块放到右侧去，页面风格最好一个月换一种，如果遇到这种老板，提出这种要求，并且你的页面是用Table布局的，那么你会崩溃的，工作量那是大大滴~，如果不相信的话，你们自己可以找个页面，用Table布局出来，然后变换板块和风格，你就会体会到Table布局的不灵活性，这是为什么呢，因为Table的诞生是为存储数据用的，功能和Execel差不多，不是用来布局用的，只不过后来大家发现用Table可以把想放的页面元素，比如图片，放到任何自己想放的地方，且做出来的页面可以兼容多种浏览器，于是Table就承担起了布局页面的重担，这一做就是好几年... ...直到Web2.0时代的到来，Table才从布局页面的工作中逐渐解脱，专心的去存储数据^_^
既然Table是为存储数据诞生的，那谁的诞生是为了页面布局呢？
答案就是:DIV，DIV就是为布局页面而诞生的，只不过一直不被人认同，原因就是DIV去布局页面需要CSS的配合，使用比较繁琐，还不如Table拖拖拽拽页面就布局OK了，感觉还不如Table方便，从而DIV被人们放置在一个无人问津的昏暗角落里，暗暗的等待着伯乐的出现，直到2003年美国加州Scott Design公司参加了在旧金山举办的有关网页排版和设计的一个研讨会上的演讲，使DIV看到了阳光，走出了阴霾... ..
说了那么多，我们对比一下Table布局页面和DIV布局页面的优缺点
使用表格进行页面布局会带来很多问题：
* 把格式数据混入你的内容中。这使得文件的大小无谓地变大，而用户访问每个 页面时都必须下载一次这样的格式信息,带宽并非免费。
* 这使得重新设计现有的站点和内容极为消耗劳力 (且昂贵)。
* 这还使我们保持整个站点的视觉的一致性极难，花费也极高。
* 基于表格的页面还大大降低了它对残疾人和用手机或 PDA 浏览者的亲和力。
而使用CSS进行网页布局，它会：
* 使你的页面载入得更快
* 降低你的流量费用
* 让你在修改设计时更有效率而代价更低
* 帮助你的整个站点保持视觉的一致性
* 让你的站点可以更好地被搜索引擎找到
* 使你的站点对浏览者和浏览器更具亲和力
* 在世界上越来越多人采用 Web 标准时，它还能 提高你的职场竞争实力 (事实上也就是降低失业的风险)。
网上有一篇文章，转过来，文章着重介绍DIV三点优势,也许看完文章后，就像社区元老heflyaway说的感觉作者比较迷恋Table，每篇文章都不可避免的带有个人色彩，而转出来的目的，其实就是想给大家降降DIV+CSS的温度，免得“走火入魔”，视DIV+CSS是为万能的，如果想学好CSS布局页面，就要从多个方面看它，好了，不多说了，下面是作者对CSS布局页面的三点优势及理解：
1、内容和形式分离，网页前台只需要显示内容就行，形式上的美工交给CSS来处理。生成的HTML文件代码精简，更小打开更快。
2、改版网站更简单容易了，不用重新设计排版网页，甚至于不用动原网站的任何HTML和程序页面，只需要改动CSS文件就完成了所有改版。对于门户网站来说改版就像换件衣服一样简单容易。
3、搜索引擎更友好，排名更容易靠前。
第一点、内容和形式分离
网页前台只需要显示内容就行，形式上的美工交给CSS来处理。生成的HTML文件代码精简，更小打开更快。
这个是DIV+CSS技术最显著的特点，也是CSS存在的根源。完全的颠覆现在传统（table）网页设计的技术。所有现在用table制作的内容，都可以用CSS来解决掉，而且解决的更完美，更强大。不需要大家再表格套表格，让生成的网页文件大小更精简，更小。table时代，一个页面表格达到10个以上是非常普遍的事情，但是现在用DIV+CSS，一个table都可以不用，就完全达到之前的效果，这就直接导致网页文件大小比使用table时减少50%-80%，更节约各位站长的硬盘空间，访问者打开网页时更快，而且用div+CSS时，不像以往使用table时，必须把全部table读取完了才显示页面内容，现在是可以读一个div就显示一个效果，大家打开网页不用等。好处真是明显而强大。
这个优点的确是显著的，凡是使用传统table建的网页，内容多的话，有时候达到30K左右都有可能，文件打了打开时，肯定就有0.0几秒的延迟。使用DIV+CSS，你前台打开看到的全是直接内容，CSS文件都是导入链接的，是另一个文件，根本和HTML文件大小没关系，这种生成的HTML文件，一个也就10K左右大小。
第二点，改版网站更简单容易了
不用重新设计排版网页，甚至于不用动原网站的任何HTML和程序页面，只需要改动CSS文件就完成了所有改版。
DIV+CSS对于门户网站来说改版就像换件衣服一样简单容易，改版时，不用改动全站HTML页面，只需要重新写CSS，再用新CSS覆盖以前的CSS就可以实现改版了。方便吧。
第三点，搜索引擎更友好，确实能够对SEO起到一定的帮助。
通过DIV+CSS对网页的布局，可以让一些重要的链接、文字信息，优先让搜索引擎蜘蛛爬取。这对于SEO也有帮助。
综上所述，个人感觉DIV+CSS不能太迷信它的很好很强大，它作为制作网页，美化网页的一个重要辅助是很强大方便的。可以弥补table制作框架和表格时的很多不足和美工上的缺点，但是完全只用它来做，太费时费力，对于全国中小型网站长来说，真的不太适合。我个人觉得用table+DIV+CSS是最好的组合，也是最省时省力的办法。
还需要再说明一下，本节讲得是Table布局页面和CSS布局页面的问题，讨论的是“布局页面”上用谁更好，并不是说在CSS布局的页面内不能用Table，真正厉害的人物是DIV、Table、CSS用得恰到好处，他们三个各做各的事情，DIV布局页面，Table存储数据，CSS给页面穿衣服！
第三章
xHTML+CSS与SEO的内容，后面章节会详细给大家介绍，这里就先说一些，让大家对xHTML+CSS与SEO有一定的认识，为后面制作页面打基础，毕竟我们做出来的页面还是要给搜索引擎看的，所以不能不提提xHTML+CSS与SEO的关系。
1)将页面中最重要的内容用h1标签括起来，h1的内容就和页面title很自然的包含了站点或者页面的核心关键词搜索引擎很重视h1标签的内容哟
2)合理的运用h2、h3等标题标签，他们对于页面来说就是文章不同的等级或者不同的功能区域的标志性元素
3)页面meta信息不可忽视，一定要包含页面核心的内容
4)为了便于搜索引擎更方便的抓取，要尽可能的保证HTML页面代码纯净，强调一下，既然是xHTML+CSS布局页面，所以CSS代码要单独写在一个文件内，保证CSS部分和HTML部分彻底分离；html页面中使用id和class，尽可能的避免style="";尽量使用标准的CSS命名规范，从这里就可以看出你这个页面重构师是否专业哟；尽量使用CSS的缩写以节省代码，例如padding:10px 20px 10px 20px;缩写为padding:10px 20px;最好不要在HTML页面用font、center这种标签。
5)在HTML页面中strong标签是可以使用的，可以进一步强化关键词和相应的文字信息。
6)页面中的javascript代码会对搜索引擎分析页面内容产生干扰，可以将javascript代码封装在一个.js文件中外部调用。
7)尽可能的加入alt注释，因为百度和google都有搜索图片的功能，如果加了alt，就更方便搜索蜘蛛的爬行，搜索相应关键词，就可能出现你网站上的图片，点击图片不就进入你的网站了嘛，就又多了点流量吧。
第四章
本节主要讲解，两个内容，
第一：CSS如何控制页面样式，有几种方式；
第二：这些方式出现在同一个页面时的优先级。
使用xHTML+CSS布局页面，其中有个很重要的特点就是内容与表象相分离，内容指HTML页面代码，表象就是CSS代码了，如果把页面看成穿着衣服的人的话，人就是HTML，是内容，而衣服呢就是CSS，是表
象，现在出现的问题是，如何让CSS去控制页面？或者说，如何让衣服穿在人身上，好体现出人得风格特点；不同的CSS就可以使页面出现不同的风格适用不同的网站，而不同的衣服，人穿上后就会体现
出不同的职业。
第一：如何让CSS去控制HTML页面效果呢？
有这么4种方式，行内方式、内嵌方式、链接方式、导入方式
1）行内方式
行内方式是4种样式中最直接最简单的一种，直接对HTML标签适用style=""，例如：
1.TYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2.
3.
4.
5.无标题文档
6.
</p><p style='padding:5px 0px;'>21、7.<!--
8.#div1{width:64px; height:64px; float:left;}
9.#div1 img{width:64px; height:64px;}
10.-->
11.
12.
13.
14.如果要保持页面风格统一，只需要把这些公共的CSS文件单独保存成一个文件，其他的页
面就可以分别调用自身的CSS文件，如果需要改变网站风格，只需要修改公共CSS文件就OK了，相当的方便，这才是我们xHTML+CSS制作页面提倡的方式。
HTML代码
1.
2.
3.
4.
5.无标题文档
6.
7.
8.
9.像国庆中某个方阵中，肯定都是不同的人，却均穿红色衣服，手中高举花环，样式都是一样的，如果想让这一类人都有共同的样式，该怎么做呢~呵呵，和ID选择器的用法类似，只不过把id换做class，如下：
1.12px;
3.background:#900;
4.color:090;
5.}
补充:一个标签可以有多个类选择器的值，不同的值用空格分开，如：
1.最少的一种选择器“通用选择器”
1.*{此处为CSS代码}
强大之处是因为他对父级中的所有HTML标签进行样式定义，可对具有共同样式的标签样式进行定义(有点小学数学中的提取公因式)，这样可以大大精简代码；既然有这么强大的功能为什么是用的最少呢，同样还是因为他的强大，他是对父级元素内的所有标签进行定义，所以只要你定义了，那么父级里面的所有的标签，甭管有没有必要，也都相当于加上了通用选择器里面的代码了，能这么说大家不能够完全理解，没关系，我给大家举个例子，请看下面
1.EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2.
3.
4.
5.无标题文档
6.
7.<!--
8.#div1 *{
9.background:#eee;/*设置DIV1里面所有的元素背</p><p style='height:0px;padding:0;overflow:hidden'>34、景均为灰色*/
10.color:#333;/*设置置DIV1里面所有的元素的字体颜色均为黑色*/
11.}
12.-->
13.
14.
15.
16.是不是样式一样，这就是通用选择器的强大之处，不管里面有多少个标签都会将样式加到所有标签内，如果div1里面得所有的标签都有一部分相同的CSS代码，那么可以把这部分代码提取出来，用通用选择器来定义，这样可以大大缩减代码，但是如果div1里面只要有一个和其他元素没有相同的代码，就不能用通用选择器来定义，这也就是CSS通用选择器不灵活的一点。现在大家明白为什么通用选择器是选择器里面功能最强大的但又是用的最少的选择器了吧~~呵呵
对于通用选择器还有一个不得不提的用法，就是为了保证作出的页面能够兼容多种浏览器，所以要对HTML内的所有的标签进行重置，会将下面的代码加到CSS文件的最顶端
1.*{margin:0; padding:0;}
为什么要这么用呢，因为每种浏览器都自带有CSS文件，如果一个页面在浏览器加载页面后，发现没有CSS文件，那么浏览器就会自动调用它本身自带的CSS文件，但是不同的浏览器自带的CSS文件又都不一样，对不同标签定义的样式不一样，如果我们想让做出的页面能够在不同的浏览器显示出来的效果都是一样的，那么我们就需要对对HTML标签重置，就是上面的代码了，但是这样也有不好的地方，因为HTML4.01中有89个标签，所以相当于在页面加载CSS的时候，先对这89个标签都加上了{margin:0; padding:0;}，在这里我不建议大家这么做，因为89个标签中需要重置的标签是很少数，没有必要将所有的标签都重置，需要哪些标签重置就让哪些标签重置就可以了，如下
1.body,div,p,a,ul,li{margin:0; padding:0;}
如果还需要dl、dt、dd标签重置，那就在上面加上就可以了，如下
1.body,div,p,a,ul,li,dl,dt,dd{margin:0; padding:0;}
用到那些就写那些，这点也可以看做衡量页面重构师制作页面水平的高低，以及是否专业的一个方面到这里大家更应该明白这句话“通用选择器是功能最强大但是用的最少的选择器”了吧~^_^
OK！选择器的内容我向大家应该都明白了，后面就继续讲解一下选择器的集体声
明”和“选择器的嵌套”
【选择器的集体声明】
在我们使用选择器的时候，有些标签样式是一样的，或者某些标签都有共同的样式属性，我们可以将这些标签集体声明，不同的标签用“,”分开，比如：
1.h1,h2,h3,h4,h5,h6{color:#900;}
1.#one,#three,.yellow{font-size:14px;}
2.#one{background:#ccc;}
3.#three{background:#ccc;}
4..yellow{background:#ccc;}
和小学的提取公因式差不多，把共同的部分提取出来，这么做的好处，相同的部分共同定义，不同的部分单独定义，保证风格统一，样式修改灵活，这也是优化CSS代码的一块，要记住哟~
【选择器的嵌套】
选择器也是可以嵌套的，如：
1.#div1 p a{color:#900;}/*意思是在ID为div1
2.内的p标签内的链接a标签的文字颜色为红色*/
这样的好处就是不需要在单独的为ID为div1的标签内的p标签内的a标签单独定义class选择器或者ID选择器，CSS代码不就少了嘛~同样也是CSS代码优化的一块。
到这里，基本的选择器说完了，但是还需要给大家介绍一个“通用选择器”
1.*{此处为CSS代码}
好，这节课主要讲解了三种CSS代码选择器、选择器的声明、选择器的嵌套三块知识，要掌握好，如果有不懂，可以留言。
第六章
规范的命名也是Web标准中的重要一项，标准的命名可以更好的看懂代码，我想大家应该都有这种经历，某日翻出自己过去写的代码居然看不懂了，呵呵，为了避免这种情况我们就要规范化命名，再说了，现在一个项目不是一个人就可以完成的，是需要大家互相合作的，如果没有规范化命名，别人就无法看懂你的代码，大大降低了工作效率，所以必须规范化命名，这样还显着咱专业！
好了不多说了，关于CSS命名法，和其他的程序命名差不多，也是有三种：骆驼命名法，帕斯卡命名法，匈牙利命名法。
【骆驼命名法】
说到骆驼大家肯定会想到它那明显的特征，背部的隆起，一高一低的，我们的命名也要这样一高一低，怎么才能这样，就用大小写字母呗~，大写的英文就相当于骆驼背部的凸起，小写的就是凹下去的地方了，但是这个也是有规则的，就是第一个字母要小写，后面的词的第一个字母就要用大写，如下：
1.#headerBlock
2..navMenuRedButton
【帕斯卡命名法】
这种命名法同样也是大小写字母混编而成，和骆驼命名法很像，只有一点区别，就是首字母要大写，如下
1.#HeaderBlock
2..NavMenuRedButton
【匈牙利命名法】
匈牙利命名法，是需要在名称前面加上一个或多个小写字母作为前缀，来让名称更加好认，更容易理解，比如：
1.#head_navigation
2..red_navMenuButton
以上三种，前两种（骆驼命名法、帕斯卡命名法）在命名CSS选择器的时候比较常用，当然这三种命名法可以混合使用，只需要遵守有一个原则就可以，就是“容易理解，容易认，方便协同工作”就OK了，没有必要强调是那种命名法。
以下为于页面模块的常用命名
头：header
内容：content/container
尾：footer
导航：nav
侧栏：sidebar
栏目：column
页面外围控制整体布局宽度：wrapper
左右中：left right center
登录条：loginbar
标志：logo
广告：banner
页面主体：main
热点：hot
新闻：news
下载：download
子导航：subnav
菜单：menu
子菜单：submenu
搜索：search
友情链接：friendlink
页脚：footer
版权：copyright
滚动：scroll
内容：content
到这节课，都是CSS非常基础的知识，是为了照顾没有一点基础的同学，从下节课开始，将介绍CSS布局页面中的很重要的两个概念，也是必须要掌握的概念，如果不能很好理解的话后面再布局页面的时候就会出现很多问题。
第七章
盒模型，是XHTML+CSS布局页面中的核心！是关系到设计中排版定位的关键，都遵循盒模型规范，例如内容常指文字、图片等元素，但是也可以是小盒子（DIV嵌套），与现实生活中盒子不同的是，现实生活中的东西一般不能大于盒子，否则盒子会被撑坏的，而CSS盒子具有弹性，里面的东西大过盒子本身最多把它撑大，但它不会损坏的。填充只有宽度属性，可以理解为生活中盒子里的抗震辅料厚度，而边框有大小和颜色之分，我们又可以理解为生活中所见盒子的厚度以及这个盒子是用什么颜色材料做成的，边界就是该盒子与其它东西要保留多大距离。在现实生活中，假设我们在一个广场上，把不同大小和颜色的盒子，以一定的间隙和顺序摆放好，最后从广场上空往下看，看到的图形和结构就类似我们要做的网页版面设计了，如下图

                 由“盒子”堆出来的网页版面
传统的前台网页设计是这样进行的：根据要求，先考虑好主色调，要用什么类型的图片，用什么字体、颜色等等，然后再用Photoshop这类软件自由的画出来，最后再切成小图，再不自由的通过设计HTML生成页面，改用CSS排版后，我们要转变这个思想，此时我们主要考虑的是页面内容的语义和结构，因为一个强CSS控制的网页，等做好网页后，你还可以轻松的调你想要的网页风格，况且CSS排版的另外一个目的是让代码易读，区块分明，强化代码重用，所以结构很重要。如果你想说我的网页设计的很复杂，到后来能不能实现那样的效果？我要告诉你的是，如果用CSS实现不了的效果，一般用表格也是很难实现的，因为CSS的控制能力实在是太强大了，顺便说一点的是用CSS排版有一个很实用的好处是，如果你是接单做网站的，如果你用了CSS排版网页，做到后来客户有什么不满意，特别是色调的话，那么改起来就相当容易，甚至你还可以定制几种风格的CSS文件供客户选择，又或者写一个程序实现动态调用，让网站具有动态改变风格的功能。
第八章
我们先来分析一下块级元素、内联级元素的定义和解析：
块元素(block element)一般是其他元素的容器元素，块元素一般都从新行开始，它可以容纳内联元素和其他块元素,常见块元素是段落标签'P"。“form"这个块元素比较特殊，它只能用来容纳其他块元素。
　　如果没有css的作用，块元素会顺序以每次另起一行的方式一直往下排。而有了css以后，我们可以改变这种html的默认布局模式，把块元素摆放到你想要的位置上去。而不是每次都愚蠢的另起一行。需要指出的是，table标签也是块元素的一种，table based layout和cssbased layout从一般使用者（不包括视力障碍者、盲人等）的角度来看这两种布局，除了页面载入速度的差别外，没有其他的差别。但是如果普通使用者不经意点了查看页面源代码按钮后，两者所表现出来的差异就非常大了。基于良好重构理念设计的css布局页面源码，至少也能让没有web开发经验的普通使用者把内容快速的读懂。从这个角度来说，css layout code应该有更好的美学体验。
　　你能够把块容器元素div想象成一个个box，或者如果你玩过剪贴文载的话，那就更加容易理解了。我们先把需要的文章从各种报纸、杂志总剪 下来。每块剪下来的内容就是一个block。然后我们把这些纸块按照自己的排版意图，用胶水重新贴到一张空白的新纸上。这样就形成了你自己独特的文摘快报了。作为一种技术的延伸，网页布局设计也遵循了同样的模式。
内联元素(inline element)一般都是基于语义级(semantic)的基本元素。内联元素只能容纳文本或者其他内联元素，常见内联元素 “a”。
　　需要说明的是：inline element的中文叫法，有多种内联元素、内嵌元素、行内元素、直进式元素。基本上没有统一的翻译，爱怎么叫怎么叫吧。另外提到内联元素，我们会想到有个display的属性是display:inline;这个属性能够修复著名的IE双倍浮动边界问题。
　　块元素(block element)和内联元素(inline element)都是html规范中的概念。块元素和内联元素的基本差异是块元素一般都从新行开始。而当加关于我们      便捷服务       自信AI       AI导航        抽奖活动©2010-2026 宁波自信网络信息技术有限公司  版权所有客服电话：[phone]  投诉电话：[phone]浙公网安备33021202000488号   浙ICP备2021020529号-1  |  浙B2-20240490  关注我们 ：