14,616
次編輯
變更
Div+css
,無編輯摘要
{| class="wikitable" align="right"|-| style="background: #FFB6C1" align= center| '''<big>Div+css</big> '''|-|[[File:Css.jpg|缩略图|居中|[https://image.baidu.com/search/detail?ct=503316480&z=undefined&tn=baiduimagedetail&ipn=d&word=Div%2Bcss&step_word=&ie=utf-8&in=&cl=2&lm=-1&st=undefined&hd=undefined&latest=undefined©right=undefined&cs=744224573,1439816324&os=1985241083,2582677289&simid=0,0&pn=31&rn=1&di=107700&ln=951&fr=&fmq=1584159023346_R&fm=&ic=undefined&s=undefined&se=&sme=&tab=0&width=undefined&height=undefined&face=undefined&is=0,0&istype=0&ist=&jit=&bdtype=15&spn=0&pi=0&gsm=0&objurl=http%3A%2F%2Ftxt6-4.book118.com%2F2017%2F1111%2Fbook139704%2F139703360.jpg&rpstart=0&rpnum=0&adpicid=0&force=undefined&ctd=1584159254191^3_1007X610%1 原图链接][https://max.book118.com/html/2017/1111/139703360.shtml 来自 原创力文档 的图片]]]|-| style="background: #CDCDCD" align= center| |-| align= light|'''外文名 ''':div+css '''本 质''':WEB设计标准 '''特 点''': 实现网页页面内容与表现相分离 ''' 领 域''': 计算机|}'''DIV+CSS ''': 是WEB设计标准,它是一种网页的布局方法。与传统中通过表格(table)布局定位的方式不同,它可以实现网页页面内容与表现相分离。提起DIV+CSS组合,还要从XHTML说起。XHTML是一种在HTML(标准通用标记语言的子集)基础上优化和改进的新语言,目的是基于XML应用与强大的数据转换能力,适应未来网络应用更多的需求。 “DIV+CSS”其实是错误的叫法,而标准的叫法应是XHTML+CSS。因为DIV与Table都是XHTML或HTML语言中的一个标记,而CSS只是一种表现形式。也许其提出者本意并没有错,但是跟风者从表现曲解了其意思,认为整个页面就应当是DIV+CSS文件的组合。<ref>[http://ent.sina 外 SM公司],百度 文 名 div+css 本 质WEB设计标准 特 点 实现网页页面内容与表现相分离 领 域 计算机库,2017-12-19</ref>
==作用==
1、精简的代码,使用DIV+CSS布局,页面代码精简,这一点相信对XHTML有所了解的都知道。代码精简提高了百度蜘蛛的爬行效率以及高效性,能在最短的时间内爬完整个页面,同时这样对收录质量有一定好处;
2、提高访问速度、增加用户体验性
使得加载速度得到很大的提高,那么用户点击页面的等待时间就越少,用户体验性的增加相应的带来就是网站受到搜索引擎的喜欢,进而提高网站排名。
3、div+css结构清晰,很容易被搜索引擎搜索到,天生就是适合优化seo,降低网页大小,让网页体积变得更小。注意:div+css结构清晰、精简,不意味着可以全部用div+css结构,比如通篇HTML标签全DIV的,貌似除了<head>之上及<body>之上及之外,其它全是<div>,就如同整个HTML是一万个毫不相干的内容拼装起来,或者通篇是<div><ul><li>结构的,就如同这个页面所有元素全是列表。事实上这两种情况还相当普遍,因为曲解了“DIV+CSS”的真实含义,也许根本就不应该有这个说法,因为一个完整页面几乎不可能仅仅DIV+CSS就能完成。<ref>[http://ent.sina SM公司],百度文库,2017-12-19</ref>
==方法==
css是层叠样式表(Cascading Style Sheets)的缩写,用于定义HTML元素的显示形式,是W3C推出的格式化网页内容的标准技术。网页设计者必须掌握的技术之一。<ref>[http://ent.sina SM公司],百度文库,2017-12-19</ref>
在HTML文档中加入CSS
样式表可分为嵌入式样式表、外部样式表和内联样式表三种,在同一文档内可以同时使用三种方法。
==发展==
1.样式定义放在一个单独的文件中,例:新建一个后辍为CSS的样式定义。
元素{ 属性color:值red;} 在head段使用<link>标记,
引用语法:<link rel=”stylesheet” type=”text/css” href=”样式表URL” />
2.嵌入式样式表:
<style>元素段必须出现在head段内,有一个开始和结束标记,并且可以有多个<style>段
语法格式: <style type=”text/css”>
==使用误区==
1、DIV+CSS的合理之处在于可以进行网页的统一设计管理,通过一个样式表,牵一发而动全身,只要修改样式表,就可以统一全站的风格,如果为一个页面单独做一个样式表,或者一个div就做一个样式表,没有全局设计观念,那么这个div+CSS的设计方式就完全没有必要,甚至成了累赘;
2、像Table一样用DIV+CSS,无穷尽的嵌套,其效果与Table设计没有两样,并不会带来搜索引擎的优化效果,反而会增加页面的负担;
3、推崇Div+CSS,却不考虑兼容性,TABLE设计由来已久,得到浏览器的广泛支持,所以显示效果很好,不会出现错位情况,但是DIV+CSS却在 部分浏览器中会发生页面错位的情况,因此在进行设计的时候也要考虑到不同浏览器的情况,进行更改和调试。<ref>[http://ent.sina SM公司],百度文库,2017-12-19</ref>==视频==<center>{{#iDisplay:h0926zh4thj|640|370|qq}} <big>DIV+CSS布局的操作方法</big> {{#iDisplay:f0926ehsv28|640|370|qq}} <big>DIV+CSS页面布局实例制作</big></center>==参考资料=={{Reflist}}[[Category: 550 經濟學總論 ]]