Azi*_*ode 6 html javascript css jquery
我想点击 DIV（文章列1）（“这是一个矩形”）
它应该将我重定向到另一个 HTML 文档：
https://s3-us-west-1.amazonaws.com/example/the-example.html
块引用
<style>
#content1 {
width: 70%;
overflow: auto;
margin: 4% 0% 0% 23%;
padding-left: 6%;
}
#content1 div {
float: left;
width:27%;
height:20%;
background-color: #efefef;
margin: 1% 3% 2% 0%;
padding: 2% 2% 1% 2%;
text-align: center;
}
#content1 p {
color:#f91d04;
}
.article-column1 {
-moz-box-shadow: -5px 5px 29px #777777;
-webkit-box-shadow: -5px 5px 29px #777777;
box-shadow: -5px 5px 29px #777777;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
}
.article-column2 {
-moz-box-shadow: -5px 5px 29px #777777;
-webkit-box-shadow: -5px 5px 29px #777777;
box-shadow: -5px 5px 29px #777777;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
}
.article-column3{
-moz-box-shadow: -5px 5px 29px #777777;
-webkit-box-shadow: -5px 5px 29px #777777;
box-shadow: -5px 5px 29px #777777;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
}
.article-column4 {
-moz-box-shadow: -5px 5px 29px #777777;
-webkit-box-shadow: -5px 5px 29px #777777;
box-shadow: -5px 5px 29px #777777;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
}
</style>
<body>
<div id="content1">
<div class="article-column1">
<img src ="https://s3-us-west-1.amazonaws.com/plus32med.png">
<p>New Workout</a></p>
</div>
<div class="article-column2">
<img src = "https://s3-us-west-1.amazonaws.com/clock61.png">
<p>History</p>
</div>
<div class="article-column3">
<img src = "https://s3-us-west-1.amazonaws.com/money57.png">
<p>Graph</p>
</div>
<div class="article-column4">
<img src = "https://s3-us-west-1.amazonaws.com/play11.png">
<p>video</p>
</div>
</div>
</body>
块引用
在 HTML5 中，您可以将您<div> 的内容包裹在一个锚元素中。
SEO明智的做法总是使用 Anchor 标签而不是 JavaScriptonclick处理程序：
<a href="page.html">
<div>Yey I'm clickable</div>
</a>
PS：确保包装内没有其他锚点或动作按钮元素<a>。
<div onclick="window.location.href = 'http://example.com';">Click this div to get redirected.</div>