首页 > 代码库 > 12.26~12.30工作日志

12.26~12.30工作日志

2016.12.26/27
1.writing-mode: vertical-rl;在电脑显示有效果,在手机端无效
  解决办法:改为 -webkit-writing-mode: vertical-rl;
 
2.div设置inline-block之后,如果没有设置固定宽高,div内的内容将正常显示,div缩为一个点?????????
 
 
3.设置float的元素最好设置好宽度,便于控制
 
4.document.getElementsByClassName(classname)获取的是数组数组!!!!就算获取的只有一个元素,也是得到一个只有一个元素的数组,必须加上[0]才能访问数组中的元素。。。。。
 
2016.12.28
1.CSS3里面加入了一个“-webkit-font-smoothing”属性。
 
     它有三个属性: 

 

     none        ------ 对低像素的文本比较好 

     subpixel-antialiased    ------默认值 

     antialiased           ------抗锯齿很好 

2.iconfont显示是黑框说明文件没有加载,引入文件地址要正确!!!!!!!!!!

3.移动端没有鼠标滑过事件,对普通标签如div加伪类hover、focus、active等并不会有相应效果,解决办法,将内容放置在a标签内,a标签设置inline-block属性即可

4.媒体查询@media,如果和普通样式放在同一个CSS文件中,必须放在相应通用样式的下    面,否则,CSS代码从上向下执行时,通用样式会将媒体查询样式覆盖掉;更为方便的方法是将所有媒体查询的内容单独放在了一个CSS文件中,在head中引用顺序为先通用后媒体

2016.12.29

1.由于em单位是相对于父元素的比例,在层层嵌套的结构中计算比较麻烦,可以改用rem单位,相对于html根元素的比例

2.小苹果html服务器. 用于移动端测试页面

http://www.xbole.com/

3.chrome默认最小字体12px,当设置的字体比12px小时,依旧以12px显示

4.border-image

以下写法在手机和safari中不兼容,图片不显示

{

border:1em solid transperent;

border-image: url(image/Group.png) 35 25 round;

}

改为

{

border-width: 1em;

border-style: solid;

border-image: url(image/Group.png) 35 25 round;

}
即可正常显示
 
2016.12.30
1.icon-font使用步骤:
   ①将相应的css文件和字体文件放入项目所在文件夹
   ②HTML文件头部引用该css文件
   ③在需要引用icon字体的标签中加入class=“icon”,以及相对应的字体的类名
 
2.meta
http://www.tuicool.com/articles/A7j2QjF
   http://www.cnblogs.com/esshs/articles/157588.html
 
3.html head头标签
http://fex.baidu.com/blog/2014/10/html-head-tags/

12.26~12.30工作日志