• 人民网评:异地医保的步子还需更大一些 2019-07-18
  • 敢想敢拼的邹市明:用奥运精神助推青少年体育事业发展 2019-07-13
  • 改革开放40年——从全国糖酒会看酒业跌宕起伏酒业 中国 2019-07-13
  • 这三个史无前例,让美国有点懵了 2019-07-11
  • 文创大咖齐聚成都 共话“一带一路”文化交流 2019-07-06
  • 农历五月初二 唐代高僧雪峰义存禅师圆寂纪念日 2019-07-06
  • 山西与腾讯公司签署战略合作协议 2019-07-04
  • 山西:“四好农村路” 致富添门路 2019-07-02
  • 【专题】社会主义核心价值观主题微电影优秀作品展示 2019-07-02
  • 《钟馗捉妖记》杨旭文为魔族惨烈“献身” 2019-06-10
  • 个税法迎第七次大修 起征点由每月3500元提高至5000元 2019-06-10
  • 摄影师捕捉超强EF3龙卷风 巨大云团画面惊险壮观 2019-05-26
  • 农民夜校成十九大精神宣讲重要课堂 2019-05-25
  • 拆迁款分配引冲突 儿子推倒八旬老父致其死亡 2019-05-25
  • 2017年邵逸夫奖在港颁奖 5位科学家获此殊荣 2019-05-23
  • 代理加盟 2019全新代理计划 赚钱+省钱双管齐下,独立平台,丰厚利润!

    您现在的位置: 11选5任四包赚不赔40注 > 站长学院 > 建站教程 >

    山西十一选五任五遗漏:CSS3画返回箭头,菜单,搜索放大镜

    来源:未知 发布时间:2019-03-30热度: ℃我要评论
    在网站SEO优化中,小图标处理方式主要有三种: ①整合到一张图作为背景图,通过CSS样式background-position显示出来; ②用字体图标font-icon,几乎所有你想要的图标直接拿来用; ③用CSS3直接画,但只能画一些简单的几何图形,对浏览器有一定要求。 这几种方式都不影...

    11选5任四包赚不赔40注 www.zo-n.com 织梦模板秀站淘宝店开业,好礼送不停

           在网站SEO优化中,小图标处理方式主要有三种:

    ①整合到一张图作为背景图,通过CSS样式background-position显示出来;

    ②用字体图标font-icon,几乎所有你想要的图标直接拿来用;

    ③用CSS3直接画,但只能画一些简单的几何图形,对浏览器有一定要求。

           这几种方式都不影响优化,兼容性最好的当然是第一种,有些IE6有些还不支持图片png格式;

           最洋气的是第二种,如果不想外引用字体,可以直接写到公共CSS样式表内,兼容性较好(本人测试百度浏览器不支持);

           第三种对浏览器有一定要求,下面介绍用CSS画几个图形,移动端优化中用得比较多的:返回箭头,菜单,搜索放大镜。效果请看本博客,用手机浏览或把PC浏览器宽度控制在780px内。

    完整代码如下:

    <!doctype html>
    <html>
    <head>
    <title>CSS3返回箭头/菜单/搜索放大镜 - 秀站网秀站网</title>
    <style>
    .clear:after{clear:both}
    i{display:block}
    .back{
     float:left;
     width:20px;
     height:20px;
     border-top:4px solid #555;
     border-left:4px solid #555;
     -webkit-transform:rotate(-45deg);
     transform:rorate(-45deg);
     }
    .menu{
     float:right;
     width:30px;
     height:5px;
     border-top:5px solid #555;
     border-bottom:5px solid #555;
     background-color:#555;
     padding:5px 0;
     background-clip:content-box;
    }
    .search{
     position: relative;
    }
    .search:before{
     content: ' ';
     position: absolute;
     width: 15px;
     height: 15px;
     border: 3px solid #666;
     border-radius: 30px;
     box-shadow: inset 1px 1px 10px rgba(0,0,0,.3); }
    .search:after{
     content: ' ';
     position: absolute;
     width: 18px;
     height: 5px;
     background: #666;
     border-radius: 5px 0 0 5px;
     -webkit-transform: rotate(225deg);
     -moz-transform: rotate(225deg);
     -ms-transform: rotate(225deg);
     -o-transform: rotate(225deg);
     transform: rotate(225deg);
    }
    .search:before{
     top: 0;
     left: 30px;
    }
    .search:after{
     top:15px;
     left: 30px;
    }
    </style>
    </head>
    <body>
     <p class="top clear">
      <i class="back"></i>
      <i class="menu"></i>
      <i class="search"></i>
     </p>
    </body>
    </html>

    本文地址://www.zo-n.com/news/1372.html

      发表评论

      评论列表(条)

      • 人民网评:异地医保的步子还需更大一些 2019-07-18
      • 敢想敢拼的邹市明:用奥运精神助推青少年体育事业发展 2019-07-13
      • 改革开放40年——从全国糖酒会看酒业跌宕起伏酒业 中国 2019-07-13
      • 这三个史无前例,让美国有点懵了 2019-07-11
      • 文创大咖齐聚成都 共话“一带一路”文化交流 2019-07-06
      • 农历五月初二 唐代高僧雪峰义存禅师圆寂纪念日 2019-07-06
      • 山西与腾讯公司签署战略合作协议 2019-07-04
      • 山西:“四好农村路” 致富添门路 2019-07-02
      • 【专题】社会主义核心价值观主题微电影优秀作品展示 2019-07-02
      • 《钟馗捉妖记》杨旭文为魔族惨烈“献身” 2019-06-10
      • 个税法迎第七次大修 起征点由每月3500元提高至5000元 2019-06-10
      • 摄影师捕捉超强EF3龙卷风 巨大云团画面惊险壮观 2019-05-26
      • 农民夜校成十九大精神宣讲重要课堂 2019-05-25
      • 拆迁款分配引冲突 儿子推倒八旬老父致其死亡 2019-05-25
      • 2017年邵逸夫奖在港颁奖 5位科学家获此殊荣 2019-05-23
      • 单机斗地主游戏 今天湖北11选5开奖结果查询结果 复式8中4多少钱 多乐彩11选5遗漏 7m足球指数网 二分彩全天在线计划网 体彩第18120期江苏7位数 足球现场当晚推介 河内5分彩后三走势图 内蒙古快3最大遗漏 单双中特准免费 黑龙江时时彩走势图官 江西多乐彩高手预测 广西快三是官方开奖么 内蒙古时时彩官网平台