分类目录归档:CSS技巧

CSS技巧

css中 单位px 和em转换方法及示例分享


摘要:
下文讲述CSS中px和em的转换方法分享,如下所示;

em单位是一个相对长度单位,是我们H5开发中常用的单位,
在网页中1em = 网页默认字体的像素单位(常见的默认字体单位为16px)
即: 1em = 16px
2em =32px
0.5em =8px

 实现思路:
      1.获取网页默认字体像素值
      2.根据默认字体像素值确定出 1em的值所对应的像素
      3.使用1em所对应的像素值计算当前**em所对应的像素值

例:

  /*
     网页默认字体大小为 12px 
     则0.2em为多少像素呢?
  */
  
   0.2em = 12px *0.2 = 6px;

H5移动端开发时如何避免鼠标点击–文本框,链接 等元素时出现蓝色背景呢?


摘要:
下文讲述H5开发中如何避免鼠标点击时出现蓝色背景的方法说明,如下所示;

在手机中打开网页,当我们点击链接或文本上面会出现一个带颜色的透明框,那么我们如何在
H5页面中设置,避免出现这种现象呢?

实现思路:
    我们只需在H5页面的css中加入以下属性,即可
     body{-webkit-tap-highlight-color:transparent;}
    --------或------------
    *{-webkit-tap-highlight-color:transparent;}

CSS 如何去掉html标签textarea右下角的三角号呢?


摘要:
下文讲述CSS 调整textarea的样式示例说明,如下所示;

实现思路:
    使用css resize:none属性值
 即可剔除掉textarea标签右下角的三角号

例:

<meta charset='utf-8' /> 
<P>
maomao365.com <br />
css 剔除textarea下的三角号
</p>
<hr />  
<style>
textarea{
   height:100px;
 }
 /*剔除三角号*/
  .a{
  resize : none;
   }

</style>
<textarea>
 没有剔除三角号
</textarea>
<hr />
<textarea class="a">
剔除三角号
</textarea>
css textarea剔除三角号的示例分享

css textarea剔除三角号的示例分享