这个示例展示了如何使用HTML和CSS创建一个书页卷角的效果。当鼠标悬停在div元素上时，一个三角形形状的span元素显示，模仿了书页被卷起的视觉效果。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>layOut</title>
<style>
body{
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 16px;
color: #ED6F6F;
background: whitesmoke;
}
div{
width: 800px;
height: 600px;
margin: 0 auto;
position: relative;
line-height: 40px;
background: #97F7B0;
padding:20px 50px;
/* transition: all 0.5s ease-in-out; */
}
div h1{
text-align: center;
border:1px solid ;
padding: auto 0;
}
<html lang="en">
<head>
<meta charset="UTF-8">
<title>layOut</title>
<style>
body{
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 16px;
color: #ED6F6F;
background: whitesmoke;
}
div{
width: 800px;
height: 600px;
margin: 0 auto;
position: relative;
line-height: 40px;
background: #97F7B0;
padding:20px 50px;
/* transition: all 0.5s ease-in-out; */
}
div h1{
text-align: center;
border:1px solid ;
padding: auto 0;
}
最低0.47元/天 解锁文章
扫一扫
702
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
