CSS固定定位实现右下角可关闭广告
代码:
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.adv {
/*调整广告图位置*/
position: fixed;
right: 10px;
bottom: -20px;
/*透明度 使得可以看见下面内容*/
opacity: 0.7;
} .close {
/*关闭按钮样式*/
position: relative;
top: -315px;
right: 50px;
background-color: transparent;
border: none;
font-size: 20px;
cursor: pointer;
} .close:active {
outline: none;
}
广告图:

效果图:

CSS固定定位实现右下角可关闭广告的更多相关文章
- CSS学习笔记10 相对定位,绝对定位与固定定位
文档流中的元素的位置由元素在 (X)HTML 中的位置决定,这就是最原始的普通流,前面讲到的浮动CSS学习笔记08 浮动可以改变元素在文档流中的位置,除了这个我们还可以通过使用CSS的position ...
- JS网站右下角悬浮视窗可关闭广告
效果体验:http://hovertree.com/texiao/js/4.htm 网站右下角悬浮视窗可关闭广告代码,可收缩.展开,关闭,内容区可自定义html,兼容IE8+.FireFox.Chro ...
- CSS的三种手段让元素脱离标准本文档流——浮动、绝对定位、固定定位
1.浮动 浮动是CSS中用到的最多的一个选项,他有三个性质.关于浮动我们要强调一点,永远不是一个东西单独浮动,浮动都是一起浮动,要浮动,大家都浮动. 1.1 浮动元素脱离标准文档流 1.1.1 大概描 ...
- Js_网站右下角悬浮视窗可关闭广告
站右下角悬浮视窗可关闭广告代码,可收缩.展开,关闭,内容区可自定义html,兼容IE8+.FireFox.Chrome.Safari等主流浏览器.广告图片尺寸300x250. 使用方法:在head区域 ...
- 【css笔记】css中的盒模型和三种定位机制(固定定位,绝对定位,浮动)
html页面上的元素都可以看成是框组成的,框通过三种定位机制排列在一起就过程了我们看到的页面.而框就是盒模型. 盒模型 1.页面上的每个元素可以看成一个矩形框,每个框由元素的内容,内边距,边框和外边距 ...
- 前端学习 -- Html&Css -- 相对定位 绝对定位 固定定位
相对定位 - 定位指的就是将指定的元素摆放到页面的任意位置,通过定位可以任意的摆放元素. - 通过position属性来设置元素的定位. -可选值: static:默认值,元素没有开启定位: rela ...
- 前端CSS - 相对定位,绝对定位,固定定位
前端CSS - 相对定位,绝对定位,固定定位 1.1 相对定位 position:relative 相对定位,就是微调元素位置的.让元素相对自己原来的位置,进行位置的微调. 也就是说,如果一个盒子想进 ...
- CSS层定位——固定定位,相对定位,绝对定位
主要写关于层定位的相关知识 ㈠定位概述 ⑴像图像软件中的图层一样可以对每一个layer能够精确定位操作 ⑵层定位的position属性决定了当前的一个网页元素,可以叠加到另一个网页元素上面,那么我们把 ...
- css定位:相对定位、绝对定位、固定定位的区别与特性
css定位:相对定位.绝对定位.固定定位的区别与特性 原文地址:http://www.qingzhouquanzi.com/106.html css定位常用的有以下三种: 使用了定位的共同特性: 这三 ...
随机推荐
- 华为云服务器centos7.3安装tomcat
1. 进入tomcat官网,复制下载地址 https://tomcat.apache.org/download-80.cgi#8.5.47 鼠标右键,复制链接地址:http://mirrors.tun ...
- 虚拟机安装Windows系统,再安装orcale
本文出自:http://www.cnblogs.com/2186009311CFF/p/8724441.html 1.创建新虚拟机 2.选择自定义 3.选择workstation 5.x(据安装的系统 ...
- React Native商城项目实战12 - 首页头部内容
1.HomeTopView为首页头部内容,HomeTopListView为HomeTopView子视图. 2.HomeTopView.js /** * 首页头部内容 */ import React, ...
- DAY 6 上午
如果不是割点,答案减少2(n-1) 如果删去割点,删去之后整个图分成多个连通块 每一个联通块的大小*其他连通块的大小之和 先求出缩点之后的树 加尽可能少的边使树变成一个边双 找出树上的所有叶子节点(度 ...
- MVC3: 页面向服务传参(view->controller,get,post)
HttpGet HttpPost GetPost 总结比较 ajax get post 1)HttpGet Get是http请求的默认形式.拿MVC官方教程Movie项目举例如下. 编辑页面 Vie ...
- 002-Spring4 快速入门-项目搭建、基于注解的开发bean,Bean创建和装配、基于注解的开发bean,Bean初始化销毁、Bean装配,注解、Bean依赖注入
一.项目搭建 1.项目创建 eclipse→project explorer→new→Project→Maven Project 默认配置即可创建项目 2.spring配置 <dependenc ...
- 从 2017 OpenStack Days China 看国内云计算的发展现状
目录 目录 China Runs On OpenStack 私有云正式迈入成熟阶段 混合云的前夜已经来临 China Runs On OpenStack OpenStack Days China 作为 ...
- 阶段1 语言基础+高级_1-3-Java语言高级_1-常用API_1_第5节 String类_2_字符串的构造方法和直接创建
string的构造方法 psvm创建main方法 把字节翻译成了小a小b小c.字符串的底层科室用的byte字节数组 Ctrl+鼠标左键点击string 这个byte就保存了字符串底层的字节数据 直接创 ...
- 阶段1 语言基础+高级_1-3-Java语言高级_1-常用API_1_第6节 static静态_15_静态代码块
static的特殊用法, 静态代码块 加上构造方法,做测试 又创建一个对象 静态代码块 只执行一次 后续在学习jdbc的时候,静态代码块很有用途.
- delphi SetWindowPos改变窗体位置和状态
http://blog.163.com/yuanliaofan@126/blog/static/1730690722012534428814/ delphi SetWindowPos改变窗体位置和状态 ...