1. 四种框的存在: (1)块元素的框; (2)内联元素的框; (3)行内框;(和内联元素的框不同) (4)行框。 2. 按照标准,行内框中的文字是居中显示的。即行内框的上边和文字顶部的距离应该是行距(文字底部和下行文字顶部的距离)的一半。 但是在不同浏览器下,文字的位置会和正中间有1到2个像素的差别,由于这种差别很小,可以忽略不计。 3. 若没有设置height。 (1)块元...
无标题 1* { margin: 0; padding: 0;}body { margin:30px; font:14px/1.6em Verdana, Lucida, Arial, Helvetica, 宋体, sans-serif;}.main { overflow: hidden; width: 500px; margin: 0 auto;}.left { float: left; width: 250px; overflow: hidden;}.right { float: right; width: 245px; overflow: hidden;}.bor_top { height:1px; background:#FB9D51; overflow:hidden;}.equal { padding-bottom: 32767px; margin-bottom: -32...
用CSS使DIV背景颜色渐变,适用于IE和Chrome等浏览器。代码:<style type="text/css"> .jbkeleyi{ height: 300px; width:100px; margin:0px auto; background-image: -moz-linear-gradient(top, #F00, #000); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #00FF00), color-stop(1,#FF0000)); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FF00, endColorstr=#...
CSS层叠样式表 优势:使页面结构和表现分离1.引入方式: 1)行内样式:Hello World 2)内部样式: h2{ color:#F00; } 3)外部样式: 推荐 @import url("a.css"); // @import “a.css”; 问题:link和@import的区别: Link和@import的区别: ...
#head{height:40px;background-color:#0033CC;margin:0;}#content{background:#CCCCCC;height:200px;margin:0;}#left{width:20%;height:200px;background:#CCCC66;float:left;margin:0;}#c{width:60%;height:200px;background:red;margin:0;float:left;}#right{width:20%;height:200px;background:#339966;float:right;margin:0;}#foot{background:#0099CC;height:40px;margin:0;}head left content rigthfoot
一、CSS文件及样式命名 1、CSS文件命名规范 全局样式:global.css; 框架布局:layout.css; 字体样式:font.css; 链接样式:link.css; 打印样式:print.css; 2、CSS样式命名规范 本人建议:用字母、_号工、-号、数字组成,必须以字母开头,不能为纯数字。为了开发后样式名管理方便,大家请用有意义的单词或缩写组合来命名,让同事一看就明白这样式大概是哪一块的,这样就节省了查找样式的时间,例如: 头部样式用header,头...
1.超链接访问过后hover样式就不出现的问题? 被点击访问过的超链接样式不在具有hover和active了, 解决方法是改变CSS属性的排列顺序: L-V-H-A 2.IE6的双倍边距BUG 例如: body {margin:0} div { float:left; margin-left:10px; width:200px; height:200px; border:1px solid red } 浮动后本来外边距10px,但IE解释为20px,解决办法...
作为一个程序员,不能只学习技术,适当的时候需要站的高一点,这样才能看的更远,才会取得更高的成就! 如果你是做Web开发的,那么DIV+CSS将是我们学习的基础,很多人认为DIV+CSS很简单,的确如此,一个好的程序员,几乎可以模仿出所有显示的网页,并实现非常炫的页面特效,给人耳目一新的感觉,我也经常为能够看到一个漂亮的网页而兴奋。但是如果学习停留的层次仅限于此,那么除了做一个码工还能干什么呢! 全局思考问...
1.用display:none来隐藏元素的时候不会保留元素本来的位置,用visibility:hidden则不会 2.用margin:auto可以使一个元素居中显示 3.当元素宽度超过浏览器宽度时浏览器会出现水平滚动条,此时可是使用max-width代替width,max-width可以自适应浏览器宽度,支持IE7+及其他主流浏览器 4.当在计算元素宽度的时候,边框的长度和内边距也会被计算在内,这样的话做起来会比较麻烦,用以下这段代码可以解决这个问题 *{ -webki...
在页面上加了对联广告后发现不滚动,找了N久才发现是这句导致不滚动的,可是如果去掉的话对于用DIV+CSS开发的网站来说又是灾难要另外找解决办法,应该是JS里有代码不符合W3C的标准找了资料才知道是document.body不符合标准,换成document.documentElement就可以了,汗,纪念一下自己浪费的时间 本文转载自http://www.phpwind.net/read.php?tid=522770 以下为JS原文件,只要在首页调用就OK了。 function initEcAd() {docum...
本文转载自http://www.divcss5.com/jiqiao/j60.shtml 解决IE6网页空白的问题,主要是charset的设置。 常见网页显示空白,网页源文件完整原因如下: 1、主要原因是html和css源代码的编码不同造成 2、没有设置网页编码charset 3、charset编码设置声明标签放置的位置不正确 解决div+css开发的网页在IE6浏览器不显示的方法: 1、要求标签里的charset=UTF-8与CSS编码一致,在CSS放置编码方法为在CSS文件最顶部放在...
盒子模型的效果: 调整faceul的宽,可以调整每一排摆放的数目,调整div1的margin值,可以改变整体的位置,这是很有用的布局模式 =========================================================== html代码:
1.结构清晰 分离页面的表现与结构,我们可以构建一个div+css+js文件的做到表现、结构、行为分离,这样做的话就像我们做程序用到的那种mvc模式一样,好处就是耦合性更小,更易维护。因为代码少,结构清晰。 2.速度 速度的优势分两点考虑 占用带宽 至少要比要少写很多代码 table嵌套一般是 这样写,所以行数也要少,当然table也可以写成一行,但是div代码确是要比table少得多。 网页执行速度 1...
1. DIV+CSS的叫法不够严谨 我们以前做页面布局的时候大多是用Table,很多人称之为“Table+CSS”,而现在比较流行的是DIV布局,所以称之为“DIV+CSS”。听起来是挺合理的,岂不知这种叫法误导了绝大部分的网页开发者, 认为这样布局出来的页面是标准的页面,符合W3C标准,很多人甚至看到有人用Table就嘲笑开发者不够专业,将页面布局是否用Table来衡量是否标准的关键点,这种观点才是不专业的表现。DIV+CSS的标准叫法应该叫XHT...
DIV+CSS常用的Html网页布局代码http://school.21tx.com 2008年04月11日 网页教学网 单行一列 以下是引用片段: body { margin: 0px; padding: 0px; text-align: center; } #content { margin-left:auto; margin-right:auto; width: 400px; width: 370px; } 两行一列 以下是引用片段: body { margin: 0px; padding: 0px; text-align: center;} #content-top { margin-left:auto; margin-right:auto; width: 400px; width: 370px;} ...