html中用DIV设置个小三角形在矩形中！！大哥大姐，叔叔阿姨门没事进来看看！！！！！

yxn0000yxn 2008-03-03 03:23:01

我是搞C++的因工作需要须在HTML中 DIV设置画个矩形和三角形，俩个是重叠的，然后控制三角形旋转！！！！！！！

有心好的人可以加我QQ聊聊！！407988214 十二小时在线等教！！！

...全文

356 5 打赏收藏转发到动态举报

写回复

用AI写文章

5 条回复

切换为时间正序

请发表友善的回复…

发表回复

zing02223 2008-03-04

打赏
举报

QQ: 56653934
验证输入CSDN
你说的那些我看过，在FF下问题是挺多的
关于你说的空白，可以用障眼法代替。

yxn0000yxn 2008-03-03

打赏
举报

OK 太感谢这为仁兄了，虽然就个left 让我郁闷了一天，也从困惑中解脱出来了，由衷的说声“你是救世主啊”呵呵，

还有个小问题，就上面这个代码在Firefox中会有很多空白的地方，那应该不是程序里面的东西，在外面会有个不均匀方框，很占地方，能不能把他搞掉啊？？？

还有就是DIV能让对象旋转么？？比如说那个小三角形吧。

这为仁兄给个联系方式好么？这几天肯定要有很多问题要麻烦，有时间的话帮帮忙！

zing02223 2008-03-03

打赏
举报

上面是是我写的代码刚看俩天写的也许幼稚点矩形和三角形我都做出来了但我三角形放不到矩形中去

这个把我给郁闷了能帮我看看这代码怎么改么？？
------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<title> MiniMap </title>
<script type="text/javascript" src="../js/Navi.js"> </script>
<style type="text/css">
body{
font-size:12px;
}
.main .map{
float:left;
margin-left:3px;
margin-right:3px;
margin-top:3px;
margin-bottom:3px;
width:128px;
height:128px;

background:red;
border:1px solid #ccc;
}
#info div{
background:#FF0000;
width:0px;
height:0px;
overflow:hidden;
position: relative;
left: 80px;
}
#com_f{
border-top:64px solid #FF3300;
border-right:32px solid #FFFFFF;
border-left:32px solid #FFFFFF;
}
.clear-float{
clear:both
}
</style>
</head>
<body>

<div class="main">
<div class="map">
<div id="info">
<div id="com_f"></div>
</div>
</div>
<div class="clear-float"></div>
</div>

</body>
</html>

----------------------------
#info div{
background:#FF0000;
width:0px;
height:0px;
overflow:hidden;
position: relative;
left: 80px;
}
修改left值，top同理。如果只需要三角形在矩形内部，把left包含上面一行去掉就可以了。
另外，在FF下，你的矩形是无背景颜色的

yxn0000yxn 2008-03-03

打赏
举报

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<title>MiniMap</title>
<script type="text/javascript" src="../js/Navi.js"></script>
<style type="text/css">
body{font-size:12px;}
.main .map{
float:left;
margin-left:3px;
margin-right:3px;
margin-top:3px;
margin-bottom:3px;
width:128px;height:128px;

background:red;;border:1px solid #ccc;
}
#info div{background:#FF0000; width:0px; height:0px; overflow:hidden;}
#com_f{ border-top:64px solid #FF3300;border-right:32px solid #FFFFFF;border-left:32px solid #FFFFFF;}
.clear-float{clear:both}
</style>
</head>
<body>

<div class="main">

<div class="map"></div>
<div id="info">
<div id="com_f"></div>
</div>
<div class="clear-float"></div>
</div>

</body>
</html>
---------------------------------------------------------------------------------------------------
谢谢你的帮忙但你说的我已经解决了
上面是是我写的代码刚看俩天写的也许幼稚点矩形和三角形我都做出来了但我三角形放不到矩形中去

这个把我给郁闷了能帮我看看这代码怎么改么？？
谢谢了

zing02223 2008-03-03

打赏
举报

<!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>
</head>
<style>
div {
display:block;
font:0;
width: 0;
height: 0;
line-height: 0;
border:360px solid;
border-color:blue green yellow red ;
}
</style>
</head>
<body>
<div></div>
</body>
</html>

---------------------------------------------------
div制作三角形，改变border-color的颜色，使其中三个色成为整体背景色，这样突出来的就是一个三角形。
关于矩形，那就没有难度了
但div能否实现旋转。。。