Html 黄金比例网页模板？_Html_Css

Html 黄金比例网页模板？

html css

Html 黄金比例网页模板？,html,css,Html,Css,我试图创建一个模板网页，使用黄金比例的比例。然而，我似乎做得不对我想就如何正确使用： div用于在页面上布局面板的标签 CSS和位置属性任何其他标签或提示，将帮助我实现一个有吸引力的页面 HTML: 这里有一个链接我喜欢用左边的浮动来对齐我所有的div，并在它后面加上一个空格来完成这一行。我在这篇文章中做了一些非常广泛的黄金分割工作，这可能会对你有所帮助。也许这能帮上忙？这是一个可以与引导一起使用的扩展，并使用flexbox。我喜欢，这里是另一个带有包装器的链接，用于将所有内容居中。。

我试图创建一个模板网页，使用黄金比例的比例。然而，我似乎做得不对

我想就如何正确使用：

div

用于在页面上布局面板的标签

CSS和位置属性

任何其他标签或提示，将帮助我实现一个有吸引力的页面

HTML:

这里有一个链接

我喜欢用左边的浮动来对齐我所有的div，并在它后面加上一个空格来完成这一行。

我在这篇文章中做了一些非常广泛的黄金分割工作，这可能会对你有所帮助。

也许这能帮上忙？

这是一个可以与引导一起使用的扩展，并使用flexbox。

我喜欢，这里是另一个带有包装器的链接，用于将所有内容居中。。。

<html>
<head>
    <title>Golden Ratio</title>
    <link rel="StyleSheet" title="Default" href="gr.css" type="text/css">
</head> 
<body>          
    <div id="header">
    </div>  
    <div>
    </div>
    <div id="bodyleft">
    </div>      
    <div id="bodyright">
    </div>      
    <div id="footer">
    </div>
</body>
</html>

body {
    background-color: white;
}

#header {       
    width: 960px;
    height: 100px;
    background-color: red;
}

#bodyleft {
    position: absolute;
    top: 100px; 
    width: 592px;
    height: 700px;
    background-color: blue;
}

#bodyright {
    position: absolute;
    top: 110px;
    left: 610px;
    width: 368px;
    height: 700px;
    background-color: green;
}

#footer {
    position: absolute;     
    top: 800px;
    width: 960px;
    height: 100px;  
    background-color: black;
}