标签：ad2 ad1 color js 广告 网页内容 内联 排版
HTML+JS
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="../css/index.css">
<title>使用js和定位排版创建内联广告</title>
</head>
<body>
<div id="content">网页内容</div>
<div id="ad1">广告内容
<a href="#" onclick="ElementHidden(ad1)"><span>关闭广告 X</span></a>
</div>
<div id="ad2">广告内容
<a href="#" onclick="ElementHidden(ad2)"><span>关闭广告 X</span>
</a>
</div>
</body>
<script>
// 网页内容1
var ad1 = document.getElementById("ad1");
// 网页内容2
var ad2 = document.getElementById("ad2");
// 隐藏
function ElementHidden(element){
element.style.display = "none";
}
</script>
</html>
CSS
#content{
height: 1200px;
width: 40%;
margin: 0 auto;
background-color: yellowgreen;
}
#ad1, #ad2{
position: fixed;
top: 20px;
height: 200px;
width: 200px;
background-color: pink;
}
#ad1{
left: 20px;
}
#ad2{
right: 20px;
}
#ad1 a, #ad2 a{
position: absolute;
bottom: 5px;
right: 5px;
}
a{
text-decoration: none;
background-color: #34343059
}
标签：ad2,
ad1,
color,
js,
广告,
网页内容,
内联,
排版
From： https://www.cnblogs.com/mikizero/p/17884442.html