Html 设置元素宽度和高度的最佳方法是什么？

每个网站都有元素，必须设置元素的宽度和高度。这里是我的问题，我们如何设置宽度和高度，使网站在不同宽度/高度的不同显示器上正常工作？

px

是否优于

%

？我们什么时候应该px，什么时候应该使用%？每种方法的优点和缺点是什么

如果要指定固定/静态高度（以像素为单位），请使用px。%指父元素的总百分比。使用百分比意味着当浏览器调整大小时，网站将进行调整，而不是使用像素

---

你选择哪一个取决于你想要达到的外观和感觉。

这完全取决于你的网站类型以及你想要对各种屏幕分辨率做出的反应

仅仅使用

%和px

是不够的，还有其他的文本大小单位，例如

em和pt

等

我们还有

媒体查询

---

所以相关的问题

这完全取决于你打算做什么样的网站

许多网页使用像素上具有固定宽度的容器（如960px）。然后，如果你在photoshop、illustrator、indesign等上有一个精心制作的预设计来处理像素，那就非常容易了。但这些网页在电脑屏幕外无法正常工作，因为如果窗口宽度小于容器，除非水平滚动，否则内容不会显示

现在，如果你想让你的内容调整到任何水平宽度，你应该使用%但是在我看来这是非常困难的，你需要在开始工作之前清楚地知道你想在每个可能的宽度上显示什么

如果你决定采用“响应性”设计。。。这项工作将更加困难。我建议您使用以下内容：

@media screen and  (min-width:600px) {}
@media screen and  (min-width:800px) {}
@media screen and (min-width:1024px) {}
@media screen and (min-width:1524px) {} 

---

在CSS中，您的类对于每个宽度（或平台）都是必需的。（还有许多其他有用的@media

视情况而定。请阅读并开始使用。宽度和高度不必根据网站上的元素进行专门设置。当然可以，但不必如此。如果您选择设置宽度，则取决于您的网站是固定宽度还是响应/自适应。它们适用于不同的页面。）urposes。具有弹性或静态尺寸有两个优点/缺点，但更重要的是，响应特定的设计决策。当我使用

px

并调整浏览器大小时，会出现滚动条，但当我使用

%

并调整浏览器大小时，所有网站都会出现故障。我该怎么办？你是指屏幕上的滚动条吗浏览器？这是因为使用像素时，它无法在调整浏览器窗口时调整大小，因此它会添加滚动条以允许您查看所有内容。如果使用百分比，则它会尝试调整内容以适应浏览器窗口，因此不需要滚动条。但是，您可以将溢出css属性用于ad将滚动条添加到任何元素。