随笔分类 -  Html/Css

摘要:position:absolute 元素相对最近的 position 为 absolute / relative / fixed 的祖先元素(包含块)定位,如果没有这样的祖先元素,则以初始包含块进行定位,而初始包含块并不是以<html>或<body>进行定位的。w3c关于包含块及初始包含块的定义 我 阅读全文
posted @ 2017-01-05 21:01 Arlar 阅读(3085) 评论(0) 推荐(1) 编辑
摘要:content content content content content content content content 阅读全文
posted @ 2017-01-05 15:16 Arlar 阅读(3667) 评论(0) 推荐(0) 编辑
摘要:content content content content content content content content 关闭遮罩弹出层 点击弹出遮罩层 ... 阅读全文
posted @ 2017-01-05 09:41 Arlar 阅读(2113) 评论(0) 推荐(0) 编辑
摘要:transfrom rotate transform:rotate(20deg); 阅读全文
posted @ 2017-01-04 18:19 Arlar 阅读(1823) 评论(0) 推荐(0) 编辑
摘要:在使用了属性overflow:scroll、overflow-y:scroll、overflow-x:scroll;的元素上加上-webkit-overflow-scrolling: touch;即可 在IPhone上对div盒子设置高度height:XXXpx并使用overflow-y:scrol 阅读全文
posted @ 2016-08-01 15:06 Arlar 阅读(2933) 评论(0) 推荐(0) 编辑
摘要:<div id="container" style="position:relative;"> <a href="#">主菜单 </a> <div id="menu" style="position:absolute;z-index:10;top:100px;"> <a href="#">下拉子菜单 阅读全文
posted @ 2016-07-14 10:53 Arlar 阅读(278) 评论(0) 推荐(0) 编辑
摘要:将id为head的div固定在最顶部,所设置的CSS属性如下: 在自己手机上打开页面,向下滑动时这个div会出现短暂的向下瞬间移动之后马上跳回到最顶部,网上资料表明是position:fixed不兼容某些浏览器的缘故,解决方法有多种: 1.给这个设置了position:fixed的元素再设置一个CS 阅读全文
posted @ 2016-07-11 15:17 Arlar 阅读(10633) 评论(0) 推荐(0) 编辑
摘要:本文摘录地址:http://www.cnblogs.com/chinafine/articles/1765967.html#undefined 下面分别讲述这四个属性,以简单代码表示 <div id="parent"> <div id="sub1">sub1</id> <div id="sub2"> 阅读全文
posted @ 2016-06-29 17:25 Arlar 阅读(388) 评论(0) 推荐(0) 编辑
摘要:<body> <div style="background-color:red;"> <div style="width:50%;height:50%;background-color:green;"></div> </div> </body> 上面父div宽度继承body元素的宽度,子div内容区 阅读全文
posted @ 2016-01-21 12:04 Arlar 阅读(319) 评论(0) 推荐(0) 编辑
摘要:假定主区域宽1200px并让其居中,如上面的div盒子所示。 如何让1900px宽的banner大图主区域(即banner图中间的1200px)在div(1200px宽)中显示呢? 我的做法如上,将img变成块级元素,让它的width设为158%(这个比值是1900px比1200px得来的),lef 阅读全文
posted @ 2016-01-06 11:24 Arlar 阅读(2863) 评论(0) 推荐(0) 编辑
摘要:父元素高度固定,子元素高度不固定,要求子元素垂直居中于父元素 方法一: <div class="wrapper"> <div class="content">keleyi.com</div></div>相对应的css代码如下:.wrapper{ height:400px; display:table 阅读全文
posted @ 2015-12-10 15:13 Arlar 阅读(230) 评论(0) 推荐(0) 编辑
摘要:table{ border-collapse:collapse; border:none;} td { border:1px solid #EE7700;} 阅读全文
posted @ 2015-12-10 10:58 Arlar 阅读(477) 评论(0) 推荐(0) 编辑
摘要:先在html head 里写上再设置图片宽度,如: 阅读全文
posted @ 2015-12-09 17:06 Arlar 阅读(627) 评论(0) 推荐(0) 编辑
摘要:w3school给出的这个transition效果例子是在当前div被hover时平滑过渡改变其宽度(http://www.w3school.com.cn/tiy/t.asp?f=css3_transition1)其示例程序是:div { width:100px; height:100p... 阅读全文
posted @ 2015-12-04 22:43 Arlar 阅读(939) 评论(0) 推荐(0) 编辑
摘要:我觉得margin和padding不能统一说成“外边距和内边距”或者“外填充和内填充”下面CSS注释部分当使用margin-top和padding-top时对#footer-1子盒子和#footer父盒子样式效果是有区别的我想要的效果是父盒子处在自己在正常文档流位置相对其他盒子不动,而让子盒子顶部“... 阅读全文
posted @ 2015-12-04 15:56 Arlar 阅读(306) 评论(0) 推荐(0) 编辑

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