随笔分类 -  css

摘要:响应式设计的设计原理是通过CSS3的Media Queries来调整页面元素在不同屏幕分辨率下的显示。 在大多数的响应式设计页面中,都会使用如下的meta标记。 除此之外主要使用的是max-width,min-width等判断屏幕尺寸的特性以及orientation判断设备方向的特性 通过JavaS 阅读全文
posted @ 2017-12-20 21:29 牛三 阅读(751) 评论(0) 推荐(0) 编辑
摘要:1,图文混排布局 2,题图文字布 3,Hero Unit 图标题文混排 4,两列均分布局 5,格子布局 6,多列等高布局 7,两列自适应布局 左侧固定右侧自适应 8,三列自适应布局 左右固定,中间自适应(圣杯布局) 圣杯布局 双飞翼布局和圣杯布局的实现效果完全一样,不同在于圣杯布局需要修改父元素的p 阅读全文
posted @ 2017-12-19 18:47 牛三 阅读(362) 评论(0) 推荐(0) 编辑
摘要:1,padding与元素的尺寸, 1),对于block水平元素, 1,padding值暴走,一定会影响尺寸, 2,width非auto,padding影响尺寸, 3,width为auto或box-sizing为border-box,同时padding值没有暴走,不影响尺寸。 2),对于in-line 阅读全文
posted @ 2017-12-09 11:06 牛三 阅读(986) 评论(0) 推荐(0) 编辑
摘要:1,overflow基本属性 visible(默认) ie6会把盒子撑开 hidden 超出部分隐藏 scroll 滚动条 auto 尺寸溢出出现滚动条 inherit IE8+ 以上浏览器支持 如果overflow-x和overflow-y值相同相当于overflow,如果值不同,其中一个属性的值 阅读全文
posted @ 2017-12-09 11:05 牛三 阅读(1782) 评论(0) 推荐(0) 编辑
摘要:line-height 行高 两行文字基线之间的距离line-height 与行内框盒子模型 所有内联元素的样式表现都与行框盒子模型模型有关! 1,内容区域 大小与font-size相关 2,内联盒子 不会让内容成块显示 3,行框盒子 每一个行就是一个行框盒子,每个行框盒子又是由每一个内联盒子组成 阅读全文
posted @ 2017-12-09 11:03 牛三 阅读(359) 评论(0) 推荐(0) 编辑
摘要:1,border-width 不支持百分比 类似的out-line,box-shadow,text-shadow,... borer-width 支持关键字 thin 1px; medium 厚薄均匀 3px; thick 厚的5px; 2,border-style:solid; border-st 阅读全文
posted @ 2017-12-09 11:01 牛三 阅读(348) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示