电话悬浮代码

简介: 电话悬浮代码

代码

<style type="text/css">
*{ margin:0; padding:0; list-style:none;}
body{ font-size:14px;}
.main{ width:0px; height:0px; position:fixed; bottom:150px; border:1px solid #b83b3b; background-color:#FFF;}
<!--position:fixed为相对于浏览器来定位;bottm为从底部向上多少个像素-->
<!--background-color为弹出窗口背景颜色;width为弹出窗口的大小,修改需在下面同时修改收缩的宽度-->
.main2{ width:0px; height:0px; position:relative; padding:10px;}
.main2 ul li{ width:100%; height:30px; line-height:30px; text-align:left;}
<!--改变line-height和height即可改变行间距-->
.main2 ul li a{ color:#000; text-decoration:none;}
<!--color为菜单的文字;background-color为文字背景颜色-->
.main2 ul li a:hover{ text-decoration:underline; color:#000;}
.bar{ width:100px; height:105px; position:absolute; left:-100px; top:-1px; background:url(http://pic.kuaizhan.com/g2/M00/28/2D/wKjmqlXAH3aALlzfAAAcqLZkqM40852415) no-repeat; display:block;}
<!--将right:-25改成left:-25,并在在下面也将left改成right-->
<!--url()后面为产品目录图片的位置;宽度为100px;高度为99px-->
</style>
<body>
<div class="main">
  <div class="main2"><a href="tel:10086" class="bar"></a></div>
  </div>
</body>
相关文章
|
前端开发
CSS中如何实现鼠标悬停效果?
CSS中如何实现鼠标悬停效果?
106 0
|
关系型数据库 MySQL 应用服务中间件
手动搭建WordPress(CentOS 8)
本场景带您体验如何在CentOS 8.5 64位操作系统的云服务器上搭建并使用WordPress。
Using rqt_console to view logs:使用rqt_console查看日志
Using rqt_console to view logs:使用rqt_console查看日志
307 0
Using rqt_console to view logs:使用rqt_console查看日志
|
缓存 NoSQL Java
ehcache介绍
ehcache介绍
256 0
|
敏捷开发 持续交付 开发框架
Yii框架中的提示改成中文
我们在使用Yii的时候,会发现给的是英文提示。 但是这样对国内的用户是不友好的。 所以。 这样就可以啦。 如果是整个网站的话, 在配置里面加上一项'language'=>'zh_cn'. 恩,就是这样。
918 0
|
6天前
|
存储 弹性计算 人工智能
【2025云栖精华内容】 打造持续领先,全球覆盖的澎湃算力底座——通用计算产品发布与行业实践专场回顾
2025年9月24日,阿里云弹性计算团队多位产品、技术专家及服务器团队技术专家共同在【2025云栖大会】现场带来了《通用计算产品发布与行业实践》的专场论坛,本论坛聚焦弹性计算多款通用算力产品发布。同时,ECS云服务器安全能力、资源售卖模式、计算AI助手等用户体验关键环节也宣布升级,让用云更简单、更智能。海尔三翼鸟云服务负责人刘建锋先生作为特邀嘉宾,莅临现场分享了关于阿里云ECS g9i推动AIoT平台的场景落地实践。
【2025云栖精华内容】 打造持续领先,全球覆盖的澎湃算力底座——通用计算产品发布与行业实践专场回顾
|
5天前
|
云安全 人工智能 自然语言处理
阿里云x硅基流动:AI安全护栏助力构建可信模型生态
阿里云AI安全护栏:大模型的“智能过滤系统”。
|
5天前
|
人工智能 自然语言处理 自动驾驶
关于举办首届全国大学生“启真问智”人工智能模型&智能体大赛决赛的通知
关于举办首届全国大学生“启真问智”人工智能模型&智能体大赛决赛的通知