用于制作最右下角部分的div标签

时间:2013-06-13 12:24:06

标签: html html5

如何在底部div中进行最正确的除法,如给定的代码所示,就像一个小方框,右边的框中只使用html div标签?还告诉我如何调整它的大小。

-->

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
    <title>Vendors</title>

    <link rel="stylesheet" type="text/css" href="sheet.css" />
    <script src="jquery-1.10.1.min.js"></script>
    <script>
$(document).ready(function(){
  $("button").click(function(){
    $("p").hide();
  });
});
</script>
</head>

<body>
    <div align="top" style="width:940;height:400;border:solid;border-width:4;">
        <center><p>My top  five Vendors</p></center>
        <button>Click me</button>

</div>



<div class="bottom" align="bottom" style="height:350;width:940;border:solid">



    <div align="left" style="height:350;width:470;border:solid">
        <div align="bottom" style="height:175;width:467;border:solid">

        </div>

</div>

</body>

</html>

2 个答案:

答案 0 :(得分:0)

在修复HTML和CSS之后,您应该尝试将其定位为:

<style>
div#bottomRight{
position:absolute;
bottom:0;
right: 0: //or whatever value fits your needs
width: 200px; //or whatever value fits your needs
height: 50px; //or whatever value fits your needs
}
</style>

答案 1 :(得分:0)

您需要在宽度和高度值中添加“px”。请参阅此处的演示http://jsfiddle.net/msbodetti/dy5us/

<body>
    <div align="top" style="width:940px;height:400px;border:solid;border-width:4px;">
        <center><p>My top  five Vendors</p></center>
        <button>Click me</button>

</div>



<div class="bottom" align="bottom" style="height:350px;width:940px;border:solid">



    <div align="left" style="height:350px;width:470px;border:solid">
        <div align="bottom" style="height:175px;width:467px;background:red;">

        </div>

</div>

</body>