html - 通过 HTML 或 CSS 渲染顺序

标签 html css

最佳实践是更改网页上元素的渲染顺序。例如,我有两个要在页面上显示的 DIV:

<div id="appleSection" class="appleStyle">
    <!-- Apple DIVs, content, form elements, etc -->
</div>

<div id="orangeSection" class="orangeStyle">
    <!-- Orange DIVs, content, form elements, etc -->
</div>

根据用户选择(可能按国家/地区或其他因素),当用户更改其选择的国家/地区时,向用户呈现 DIV 的顺序可能会有所不同。某些国家/地区选择将 appleSection 置于 OrangeSection 上方,而对于其他国家/地区选择,其顺序相反。

如果页面的核心逻辑无论如何都是相同的,那么在服务器端确定顺序是否是最佳实践(可能通过 DIV 顺序不同的两个页面),或者更合适只是一个页面并使用CSS来控制appleSection是否在orangeSection之上,反之亦然?

最佳答案

选择的顺序是否必须立即更改?例如,当用户选择国家/地区时是否必须更改?或者是预渲染的?

如果是后者,我会从服务器端进行。我会寄出某种旗帜。假设您使用 JSTL 或 ASP 或其他东西,您可以根据标志的值控制顺序。我认为用两个页面来做同样的事情不是一个好主意,因为这会导致大量的代码重复。

如果它必须根据用户交互进行更改,我会使用 jQuery 之类的东西以及适当的 CSS(根据用户输入使用 jQuery 更改类)。

关于html - 通过 HTML 或 CSS 渲染顺序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2484048/

相关文章:

html - 您的浏览器不支持使用工具栏按钮或上下文菜单选项进行粘贴

html - 为什么我的填充仅在元素处于悬停状态时显示?

javascript - 如何使此弹出窗口仅在单击按钮时加载

CSS 在悬停另一个对象时更改对象

html - 我怎样才能使 "checkboxes"在每次左键单击时增加它们的数量并在右键单击时减少它们的数量?

html - iOS iframe 问题

html - 输入字段下的 Div

javascript - 使用 javascript 的图像轮播

html - 对齐中心下拉菜单 Bootstrap 4

css - 在 React 中以编程方式分配 css 类