据我所知和理解,有两种可能性来构建colum-layout或grid-layout或使用css以更复杂的方式定位元素:
1)的位置是:绝对/相对;
2)浮动:左/右;明确
是否有任何替代方案,哪些更好或更少支持,或者根本不重要您使用哪种技术?什么是最佳浏览器支持的最佳实践?
告知或已知替代方案:
3)显示:inline-block;
4)显示:table-cell; (它和html表不一样吗?)
5)html-table(但这不是css或语义)
6)css3列(支持与否支持?)
答案 0 :(得分:2)
1)位置:绝对/相对;
可以是布局的一部分,不一定。
2)浮动:左/右;明确
是的,浮动通常用于布局。
3)显示:inline-block;
这很少用于页面布局,并且对它的支持是错误的(它也是对空白敏感的)。
4)显示:table-cell; (它和html表不一样吗?)
不,这与使用HTML表格不同。表格在您的标记(内容)中,display:table-*
是您的CSS(演示文稿)的一部分。这是解决布局问题的一种很好的方法,但对于旧版浏览器来说,支持并不完全适用。
5)html-table(但这不是css或语义)
你是对的,不要使用它,表格用于标记表格数据,而不是用于布局。
6)css3列(支持与否支持?)
再一次,支持并不是真的存在,而且我认为这不仅适用于文本而非布局(即使它可以用于两者)。
最佳浏览器支持的最佳做法是什么?
如果您正在寻找一般答案,您希望自己构建它,并且您关注浏览器支持,只需使用float
s,具有相对/绝对定位如有必要。确定您想要支持哪些浏览器,并且一如既往地在不同的浏览器中测试您的布局,看看哪些有用,哪些无效。没有魔法弹,细节中的魔鬼。
答案 1 :(得分:1)
我认为你可以使用一系列内联块作为列。或者也许display: table-cell
。可能有很多种方法可以实现它。