WEB标准(div+css)该怎么去学习?学习中该注意什么?div布局和table布局的不同在哪里?它的优势在哪儿?css hack又是怎么一回事等等,如果你对这些问题还一头雾水,那么下边这些内容将为你解开谜团,带你找到答案。
俗话说:工欲善其事,必先利其器。要想学好,首先要了解什么是div标准布局,和talle相比,优势在哪儿?那么《DIV+CSS是什么意思?实质是什么? 》这篇文章将告诉你这些,如果你准备学习或正在学习div标准布局,建议您先看看这篇文章。主要包括以下内容:
- DIV+CSS是什么意思?实质是什么?
- DIV+CSS的优势何在?
- 新手学习div+css,该如何入门?
- 使用什么软件来布局页面和编辑css呢?
- 能不能提供几个实例具体讲解一下怎么来实现?
相信您来学习div标准布局,想必肯定对html及css有了一定了解了,如果还不清楚就要赶紧充电了,不然的话下面的内容学习起来就难了。什么?您连软件还没装,不会吧,除非您能精通到手写代码。否则,赶紧来www.aa25.cn主页的常用软件中把dw下载来安装上吧。
下面该进入正式学习了,本站于2010年9月推出了《十天学会web标准(div+css)》系列教程,适合初学者以最短时间掌握建站方法,从第一课和到第十课,讲的都是实际当中用到的知识,第十课把前边讲解的零碎内容串联起来,把一个网站从切图到框架,到细节布局,幻灯,再到程序的添加,ftp上传下载及错误调试等,如果你认真学完这些教程,相信已经可以做出一个有模有样的网站了。
第一天 XHTML CSS基础知识
第二天 一列布局
第三天 二列和三列布局
第四天 纵向导航菜单及二级弹出菜单
第五天 超链接伪类
第六天 html列表
第七天 横向导航菜单
第八天 下拉及多级弹出菜单
第九天 CSS表单设计
第十天 div+css网页标准布局实例教程(一)
第十天 div+css网页标准布局实例教程(二)
第十天 div+css网页标准布局实例教程(三)
新手在学习过程中,常常会遇到这样那样的问题,有时候可能因为一个很小的问题却困扰半天,那么来这里查查,看看你是不是遇到下面这些问题了。本站为了解决新手的疑惑,本站于2010年6月新特别推出了《新手常见问题》系列视频教程:
1、【视频】怎么让一个div块级元素水平居中
2、【视频】为什么页面四周有一个白边,内容不能贴边显示
3、【视频】如何清除列表前的圆点
4、【视频】格式化标签的默认样式
5、【视频】超链接样式的设置
6、【视频】CSS缩写
7、【视频】IE6的3像素bug
8、【视频】IE6的双倍边距bug
9、【视频】高度自适应
10、【视频】CSS设计网站的导航
11、【视频】背景图片美化导航菜单
12、【视频】CSS Sprites技术
13、【视频】CSS滑动门技术宽度自适应按钮
14、【视频】相对定位和绝对定位
15、【视频】CSS的行高Line Height属性
16、【视频】CSS强制换行与强制不换行
通过这些教程的学习,可以让您迅速掌握div+css布局的最基本知识和布局方法。同时可以配合本站的div+css网页版式布局频道提供的50种常用的布局版式,包括固定宽度和自适应宽度两种形式,版式总共如下:
- 1列固定宽度居中
- 1列固定宽度居中+头部
- 1列固定宽度居中+头部+尾部
- 1列固定宽度居中+头部+导航+尾部
- 2列固定宽度居中左窄右宽型
- 2列固定宽度居中右窄左宽型
- 2列固定宽度居中平分型
- 2列固定宽度左窄右宽型+头部
- 2列固定宽度右窄左宽型+头部
- 2列固定宽度左窄右宽型+头部+尾部
- 2列固定宽度右窄左宽型+头部+尾部
- 2列固定宽度左窄右宽型+头部+导航+尾部
- 2列固定宽度右窄左宽型+头部+导航+尾部
- 2列固定宽度左窄右宽型+头部+导航+尾部
- 2列固定宽度右窄左宽型+头部+导航+尾部
- 3列固定宽度居中
- 3列固定宽度居中+头部
- 3列固定宽度居中+头部+尾部
- 3列固定宽度居中+头部+导航
- 3列固定宽度居中+头部+导航+尾部
- 2列左窄右宽、高度自适应+头部+导航+尾部
- 2列右窄左宽、高度自适应+头部+导航+尾部
- 2列左窄右宽高度自适应且未知高度底部平齐、型+头部+导航+尾部
- 2列右窄左宽、高度自适应且未知高度底部平齐+头部+导航+尾部
- 1列自适应宽度
- 1列自适应宽度+头部
- 1列自适应宽度居中+头部+尾部
- 1列固定宽度居中+头部+导航+尾部
- 2列左侧固定,右侧自适应宽度,中间无缝型
- 2列右侧固定,左侧自适应宽度,中间无缝型
- 2列左侧固定,右侧自适应宽度
- 2列右侧固定,左侧自适应宽度
- 2列左侧百分比右侧自适应
- 2列左侧固定,右侧自适应宽度+头部
- 2列右侧固定左侧自适应宽度+头部
- 2列左侧固定右侧自适应宽度+头部+尾部
- 2列右侧固定,左侧自适应宽度+头部+尾部
- 2列左侧固定,右侧自适应宽度+头部+导航
- 2列右侧固定左侧自适应宽度+头部+导航
- 2列左侧固定右侧自适应宽度+头部+导航+尾部
- 2列右侧固定左侧自适应宽度+头部+导航+尾部
- 3列左右侧固定,中间列自适应居中
- 3列左右侧固定,中间列自适应居中+头部
- 3列左右侧固定,中间列自适应居中+头部+尾部
- 3列左右侧固定,中间列自适应居中+头部+导航
- 3列左右侧固定,中间列自适应居中+头部+导航+尾部
- 2列左侧固定右侧自适应宽度,未知高度+头部+导航+尾部
- 2列右侧固定左侧自适应宽度,未知高度+头部+导航+尾部
- 2列左侧固定右侧自适应宽度,未知高度且底部平齐+头部+导航+尾部
- 2列右侧固定左侧自适应宽度,未知高度且底部平齐+头部+导航+尾部
配合这些布局实例的学习,更可以让您如虎添翼,更加快速掌握。
以上这些模板地址:http://www.aa25.cn/layout/index.shtml
如果您不喜欢文字+图片教程,没关系,本站还转载了一系列入门级视频教程,同样可以让您快速成为一个div+css布局高手。从最初的基本知识与概念,到实例讲解,精彩不容错过。
CSS基础知识与核心概念
CSS初探 - CSS基本知识 - 第1课
CSS基本语法与核心概念 - CSS基本知识 - 第2课
设置丰富的文字效果 - CSS基本知识 - 第3课
CSS/DIV布局专题讲解
设置图片效果 - CSS/DIV专题讲解 - 第1课
设置网页背景 - CSS/DIV布局专题讲解 - 第2课
设置表格与表单的样式 - CSS/DIV布局专题讲解 - 第3课
设置页面和浏览器的元素 - CSS/DIV布局专题 - 第4课
用CSS制作漂亮的菜单- CSS/DIV布局专题讲解 - 第5课
CSS滤镜的应用 - CSS/DIV布局专题讲解 - 第6课
理解CSS定位与div布局 - CSS/DIV布局专题讲解 - 第7课
CSS排版 - CSS/DIV布局专题讲解 - 第8课
网页变幻 - CSS/DIV布局专题讲解 - 第9课
CSS与其他技术
CSS与Javascript的综合应用 - CSS与其他技术 - 第1课
CSS与XML的综合运用 - CSS与其他技术 - 第2课
CSS与AJAX的综合应用 - CSS与其他技术 - 第3课
CSS/DIV综合实践
博客设计DIY - CSS/DIV综合实践 - 第1课
小型工作室 - CSS/DIV综合实践 - 第2课
公司网站 - CSS/DIV综合实践 - 第3课
购物网站设计 - CSS/DIV综合实践 - 第4课
旅游观光网站设计 - CSS/DIV综合实践 - 第5课
通过这一系列的学习,相信您的水平已经上了很大的一个台阶,下一步就要多动手,做一个博客的布局,实战练习一下。这时您也可能会发现许多问题,比如说高度自适应问题啦,垂直居中,以及用float浮动后下边内容跑到上边重叠一块啦等等。毕竟教程不可能讲解的非常全面,这时您主就要多动脑了,结合上面学习的知识,举一反三,看能不能变通一下解决。如果还是解决不了,请在本站中搜索,相信您遇到的问题,一般在本站中已提供了答案。
div+css标准布局时常见的问题,我已在div+css网页版式布局的底部列出来,您可以参考一下是不是您也遇到了此类问题,主要是布局浮动和css hack问题。或者学习本站于2010年6月新特别推出了《新手常见问题》系列视频教程。
如果您还不太清楚,或遇到的问题较多,那么建议您再学习一下这些内容:
- DIV+CSS网页布局技巧实例1:设置网页整体居中的代码
- DIV+CSS网页布局技巧实例2:设置容器中的内容垂直居中
- DIV+CSS网页布局技巧实例3:设置层的透明度
- DIV+CSS网页布局技巧实例4:使用css缩写
- DIV+CSS网页布局技巧实例5:明确定义单位,除非值为0
- DIV+CSS网页布局技巧实例21:CSS代码书写样式
和这些内容:
- 超链接访问过后hover样式就不出现的问题
- firefox下如何使连续长字段自动换行
- ff下为什么父容器的高度不能自适应
- IE6的双倍边距BUG
- IE6下绝对定位的容器内文本无法正常选择的问题
- IE6下为什么图片下方有空隙产生
- IE6下这两个层中间怎么有间隙
- list-style-image无法准确定位的问题
- LI中内容超过长度后以省略号显示的方法
- web标准中定义id与class有什么区别吗
- 如何垂直居中文本
- 如何垂直居中对齐文本与文本输入框
- 为什么FF下面不能水平居中呢
- 为什么FF下文本无法撑开容器的高度
- 为什么IE6下容器的宽度和FF解释不同呢
- 为什么web标准中IE无法设置滚动条颜色了
- 为什么我定义的css样式没有作用呢
- 为什么无法定义1px左右高度的容器
- 为什么这个背景颜色无法显示
- 怎么样才能让层显示在FLASH之上呢
- 怎样使一个层垂直居中于浏览器中
- IE6使用滤镜使PNG图片透明后,容器内链接失效的问题。
- 如何让三列横向排列
- 通用的加入收藏夹代码
- 复制到系统剪贴板之IE,ff兼容版
- javascript为FF设置首页
转载:http://www.aa25.cn/div_css/535.shtml