CSS代码： css代码 .main{width:800px;/* 总的宽度 */ background:red; } .main .col1{ float:left;/* 这个是关键的地方 让col1往左浮动，这样它的后面（右边）就可以放置别的元素*//*（别的元素：可以是div，图片，文字等） */ width:300px;height:300px; background:#eee;border:1px solid #ccc; } .main .col2{ float:left;/* 这个是关键的地方 让col2也往左浮动，紧跟在col1的后面 */ margin-left:...
现在DIV+CSS布局已经很风靡了，它的优势被许多人所神话，前段时间一谈到网站设计，很多人一开口就是我会DIV，感觉自己很了不起。跟客户交流时一个劲的把人家用table布局鄙视得一毛不值。世界变得很快，短短几个月，会CSS布局的人满街都是，并不是什么很难的技术。那些还在以CSS布局为骄傲的人，可能还不知道世界已经改变吧。 DIV的好处百度搜出来很多，有很多人跟本没用过CSS布局，就是百度一下就跟别人吹。一开口就是DIV安全度...
无标题文档 * {margin:0px; padding:0px;} body { font-size: 12px; margin: 0px auto; height: auto; width: 805px; } .mainBox { border: 1px dashed #0099CC; margin: 3px; padding: 0px; float: left; height: 300px; width: 192px; } .mainBox h5 { float: left; height: 20px; width: 179px; color: #FFFFFF; padding: 6px 3px 3px 10px; background-color:#999999; font-size: 16px; } .mainBox...
DIV CSS图形菜单之仿DreamWeaver，做了四个多小时才兼容好，火狐和IE都无Bug了，搞的自己快出Bug了。 http://www.ij2ee.com/ http://www.gbsou.com/ DIV CSS布局实例：CSS标签切换代码 * {list-style-type:none; font-size:12px; text-decoration:none; margin:0; padding:0;}a {behavior:url(xuxian.htc)}.woaicss {width:438px; height:300px; overflow:hidden; margin:50px auto;}.woaicss_title {width:438px; height:3...
简单的div+css的实例布局，利用图片进行布局，首先要准备5张图片。 left-top.gif right-top.gif right.gif left-bottom.gif right-bottom.gif p1 实例1代码：固定宽度 相对定位body{ background:#fff; font:13px/1.5 Arial, Helvetica, sans-serif; margin:0; padding:0;}.rounded{ background:#aaa url(images/lt.gif) top left no-repeat; width:100%;}.rounded h...
以下布局资料原作者：Owen Briggs http://www.ynutx.net/blog/user1/rainoxu/archives/2006/2439.html 单行单列 单行单列1：采用float浮在左上角，固定宽度。 单行单列2：固定在左上角，固定宽度，采用的是绝对(absolute)定位。 单行单列3：固定在左上角，不固定宽度，采用百分比(%)定义宽度来自适应页面。 单行单列4(推荐)：固定宽度，采用在body样式中定义居中属性(text-align: center;)实现适应页面自动居中。 单行两列 单行两列...
导航在网站上占有极重要的地位，Table时代的菜单都是用若干个td并排显示而成。 现在，我们可以用语义化的标签，如li来完成。 菜单一： new document *{margin:0px; padding:0px;font-family:verdana;} ul { list-style:none; font-size:10px; } li ul { display:none; } #nav li { text-align:center; margin:3px; width:100px; border:solid 1px #ccc; position:relative; padding:6px; display:block; } #nav li ul{...
1.限制单行字符个数： 名称： （table做不到）
DIV+CSS是 网站标准 （或称“WEB标准”）中 常用术语 之一，通常为了说明与HTML 网页设计 语言中的表格（table） 定位方式 的区别，因为XHTML 网站设计 标准中，不再使用表格定位技术，而是采用DIV+CSS的方式实现各种定位。 SEO是指搜索引擎优化，主要就是通过对网站的结构、标签、排版,关键字等各方面的优化，使搜索引擎更容易抓取网站的内容，并且让网站的各个网页在等搜索引擎中获得较高的评分，从而获得较好的排名。DIV+C...
为了想让从事div+css页面架构行业感兴趣的设计师及table架构师及爱好者们少走一些弯路,特开此"家庭教学"的五人小班六天的课程(一对一的服务,提供长期在线服务,线下服务,一期不会留级二期免费重听服务,QQ群交流服务),学费1800/人.合格毕业生我们可以见机推荐从事此项工作.培训对象：1、学历不是问题,做过网页,会网页切图,最好会手写一些简单的HTML标签那会更好.最好有HTML基础;2、在职设计师，在职table架构师，有意从事网站页面制作...
基本盒子模型框架，非完整项目代码，仅是个结构，如您觉得有用欢迎转载或讨论，但引用请注明文章来源，如有问题请email指出。感谢 ～ html文件 无标题文档 Contact Us Photo News Index 新闻 评论 技术 ...
Div圆角实现 .one { display:block; overflow:hidden; height:1px; margin:0 4px; border-left:1px solid #B2D0EA; border-right:1px solid #B2D0EA; background:#B2D0EA; } .two { display:block; overflow:hidden; height:1px;/*线的高度为1px*/ margin:0 3px;/*距离外层DIV的左右边距各3px*/ border-left:1px solid #B2D0EA;/*只显示线的左边的1px*/ border-right:1px solid #B2D0EA;/*只显示线的右边的1px*/ background:#B2D0...
一、页面布局与规划 好久没有认真写点东西了，想起最近这些时间经常有朋友问到我有关于DIV+CSS布局的问题，其实归根结底还是由于没有入门造成的。那么接下来的这篇文章就带领大家入门吧... 在网页制作中，有许多的术语，例如：CSS、HTML、DHTML、XHTML等等。在下面的文章中我们将会用到一些有关于HTML的基本知识，而在你学习这篇入门教程之前，请确定你已经具有了一定的HTML基础。下面我们就开始一步一步使用D...
JQuery/AjaX/Javascript/DIV+CSS： Head First Javascrip（文字版PDF） http://www.hztraining.com/bbs/showtopic-1407.aspx 变幻之美-DivCSS网页布局揭秘(案例实战篇) http://www.hztraining.com/bbs/showtopic-1379.aspx Web编程入门经典（扫描版PDF） http://www.hztraining.com/bbs/showtopic-1272.aspx JavaScript网页特效范例宝典（影印版PDF） http://www.hztraining.com/bbs/showto...
div+CSS网页布局入门系列教程(来自标准之路) div+CSS网页布局入门系列教程(来自标准之路) CSS网页布局入门教程1：一列固定宽度 CSS网页布局入门教程2：一列自适应宽度 CSS网页布局入门教程3：一列固定宽度居中 CSS网页布局入门教程4：二列固定宽度 CSS网页布局入门教程5：二列宽度自适应 CSS网页布局入门教程6：左列固定，右列宽度自适应 CSS网页布局入门教程7：二列固定宽度居中 CSS网页布局入门教程8...