这个昵称没有被占用吧的博客

最近天天被动画和音频折磨~个人比较喜欢用css，所以需求中碰到广告牌闪烁的需求，果断使用了css3的动画，代码如下：#ad { animation: changeAd 1s infinite;}@keyframes changeAd { from { background: ad1.png no-repeat center center; background-size: 100...

今天在写h5活动的时候，使用到了flex布局，在chrome浏览器手机模式下测试一切ok，然后使用真机(iphone 5c)时，就发现了各种问题

参考文章：position失效了？设置了position为fixed的元素，如果其祖先元素的transform不为none，则该元素会相对于该祖先元素进行定位，而不是相对于窗口进行定位。一个使用swiper做的tab切换，因为只需要在单个tab页内添加一个顶部按钮，因此在位置1处添加了button，然后使用position:fixed进行定位。<div class="swi...

下面通过一个实例来说明该属性：<style> html * { margin: 0; padding: 0; } table { width: 100%; border: 1px solid red; box-sizing: content-box!important; ...

CSS中有三个属性与页面布局和box的创建有关：display，position和float，但是如何同时设置了三个属性，则三者之间有优先级关系：

table { display: table }tr { display: table-row }thead { display: table-header-group }tbody { display: table-row-group }tfoot { display: table-footer-group }col { display: ...

项目中可能经常要做具有父子结构的下拉框，像这样： 实战时，思维一直是用js插件来实现，今天重新学习HTML5时，发现可以直接用select和option实现，具体代码如下：<select> <optgroup label="人力资源部"> <option>小花</option> <option>小梅</option> </optgroup>

border是一个简写属性，即： border:border-width border-style border-color; 平时写的时候可以不写齐三个属性，写其中一个或两个也是允许的，因为这样写，浏览器会设置这个缺少属性的默认值。 border:0;等价于： border-width:0; border-style:none; border-color:value of color;

一、Flex布局是什么？Flex是Flexible Box的缩写，意为“弹性布局”，用来为盒装模型提供最大的灵活性。任何一个容器都可以指定为Flex布局，指定方式如：.box { display:flex;}行内元素也可以使用Flex布局：.box { display:inline-flex;}webkit内核的浏览器，必须加上-webkit前缀：.box { displ

box-sizing：content-box|border-box|inherit下面来看一下各值的区别： HTML代码：<div class="box"></div>CSS代码：.box { box-sizing: border-box; width: 200px; height: 200px; border: 1px solid red; padding