css 这样怎么实现?给个提示

html-css016

css 这样怎么实现?给个提示,第1张

用margin可以。因为margin可以设为负值

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html charset=utf-8" />

<title>无标题文档</title>

<style>

.img-div { background:#ccc width:200px}

.img-div img.margin-t{ margin-top:-30px}

.img-div img.margin-l{ margin-left:32px}

</style>

</head>

<body>

<div class="img-div">

<img src="img.png" /><img src="img.png" /><img src="img.png" />

<img src="img.png" class="margin-t margin-l" /><img src="img.png" class="margin-t"/>

<img src="img.png"  class="margin-t"/><img src="img.png" class="margin-t" /><img src="img.png" class="margin-t"/>

<img src="img.png"  class="margin-t margin-l"/><img src="img.png" class="margin-t" />

<img src="img.png"  class="margin-t"/><img src="img.png" class="margin-t" /><img src="img.png" class="margin-t"/>

</div>

</body>

</html>

附件就是例子,你可以直接看效果。

可以画两个等腰三角形,等腰三角形代码#ID {

width: 0

height: 0

border-left: 50px solid transparent

border-right: 50px solid transparent

border-bottom: 100px solid red}