61,126
社区成员
发帖
与我相关
我的任务
分享html中用DIV设置个小三角形在矩形中！！大哥大姐，叔叔阿姨门没事进来看看！！！！！
我是搞C++的 因工作需要 须在HTML中 DIV设置画个矩形和三角形，俩个是重叠的，然后控制三角形旋转！！！！！！！
有心好的人可以加我QQ聊聊！！407988214 十二小时在线等教！！！
有心好的人可以加我QQ聊聊！！407988214 十二小时在线等教！！！
...全文
请发表友善的回复…
发表回复
zing02223 2008-03-04
- 打赏
- 举报
QQ: 56653934
验证输入CSDN
你说的那些我看过，在FF下问题是挺多的
关于你说的空白，可以用障眼法代替。
验证输入CSDN
你说的那些我看过，在FF下问题是挺多的
关于你说的空白，可以用障眼法代替。
yxn0000yxn 2008-03-03
- 打赏
- 举报
OK 太感谢这为仁兄了，虽然就个left 让我郁闷了一天，也从困惑中解脱出来了，由衷的说声“你是救世主啊”呵呵，
还有个小问题，就上面这个代码在Firefox中 会有很多空白的地方，那应该不是程序里面的东西 ，在外面会有个不均匀方框，很占地方，能不能把他搞掉啊？？？
还有就是DIV能 让对象旋转么？？比如说那个小三角形吧。
这为仁兄给个联系方式好么？这几天肯定要有很多问题要麻烦，有时间的话帮帮忙！
还有个小问题，就上面这个代码在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;
<!--border-bottom-color:#FFF;-->
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下，你的矩形是无背景颜色的
这个把我给郁闷了 能帮我看看这代码 怎么改么 ？？
------------------------------------------------------------
<!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;
<!--border-bottom-color:#FFF;-->
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;
<!--border-bottom-color:#FFF;-->
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>
---------------------------------------------------------------------------------------------------
谢谢 你的帮忙 但你说的我已经解决了
上面是是我 写的代码 刚看俩天 写的也许幼稚点 矩形和三角形我都做出来了 但我三角形 放不到矩形中去
这个把我给郁闷了 能帮我看看这代码 怎么改么 ？？
谢谢了
<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;
<!--border-bottom-color:#FFF;-->
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能否实现旋转。。。
<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能否实现旋转。。。
