我在哪里可以使用div标签学习设计/编码可重新调整大小的html页面？

Question

我想仅使用div标签设计我的网页布局。但我不擅长。我需要了解构建可重复大小的网站的基本技术。

你能否提出一些很好的教程/技巧来启动。

Answer 1

液体布局的框架并不比http://cssgrid.net/

好

这不是一个教程，因为它是预先设计的网站的起点，但是可以帮助您了解不同屏幕尺寸的建筑网站（一直到手机）。

查看此链接以进行测试 - http://www.resizemybrowser.com/

Answer 2

有很多网站都有教程可以解决这个问题。以下是我建议您查看的一些内容：

http://www.colorplexstudios.com/articles/div_web_design_tutorial/

http://www.mardiros.net/liquid-css-layouts.html

如果您想使用div标签和css进行动态/可调整大小的设计，还可以尝试寻找流体/弹性布局的教程。

Answer 3

我知道你在问如何开始理解基于CSS的布局。

我想在这个早期阶段指出DIV标签只是作为没有语义含义的容器。虽然它们有时可以帮助进行布局，但通常可以通过对HTML元素本身进行深思熟虑的样式来获得相同的结果。

例如，UL是块级元素，CSS在这方面将其视为与DIV完全相同。

我努力在我的布局中尽可能使用一些DIV标签，而宁愿使用HTML元素的盒子模型。这样可以最大限度地减少变量，从而为将来提供更清晰，更易维护的代码。

在您学习的过程中，养成在没有DIV的情况下工作的习惯。从长远来看，你会更好地理解HTML和CSS。