Rumah > Soal Jawab > teks badan
PHP中文网2017-04-17 14:48:43
一般使用绝对定位来解决
<p class="parent">
<span class="text">推荐</span>
<p class="triangle-topleft">
</p>
</p>
.parent{
position: relative;
width: 200px;
height: 200px;
}
.parent .text{
display: inline-block;
transform: rotate(-45deg);
padding: 20px;
color: #fff;
}
.triangle-topleft{
width: 0;
height: 0;
border-top: 100px solid red;
border-right: 100px solid transparent;
position: absolute;
top: 0;
z-index: -1;
}
大家讲道理2017-04-17 14:48:43
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<style type="text/css">
.main_img{ display: block;
width: 90%;
height: 4.954em;
position: relative;
overflow: hidden;
margin-left: 0.742em;
margin-top: 0.8em;
}
.main_img .new{
width: 3.25em;
height: 3.25em;
position: absolute;
top: 0;
left: 0;
background-size: 3.25em 3.25em;
background: url(http://m.lobo666.com/Public/image/main/new.png) no-repeat center;
}
</style>
<p class="main_img">
<!-- <a href="/index.php/Home/Detail/index/id/364.html"> -->
<a href="/index.php/Home/Detail/index/id/364/aid/100004.html">
<img src="http://lobo.lobo666.com/Uploads/Building/61772d6d46.jpg">
</a>
<!-- <p></p> -->
<p class="new"></p>
</p>
</body>
</html>