wrf嵌套网格domain_嵌套网格像嵌套表一样吗?

文章澄清了WRF嵌套网格(domain)与HTML中嵌套表格的区别。在CSS布局中,嵌套网格并不破坏正常流,而表格布局则可能影响可访问性和语义结构。讨论了CSS display属性如何改变元素布局行为,并提到了子网格(subgrid)特性。
摘要由CSDN通过智能技术生成

wrf嵌套网格domain

A thing I keep hearing, and especially when talking about subgrid is, “nested grids … isn’t that like tables within tables in the olden days?”

我一直在听到的一件事,尤其是在谈论子网格时,是:“嵌套网格……这不像以前的表中的表吗?”

It is not. This is why.

它不是。 这就是为什么。

When you want to use grid layout, what you are doing is changing the display property on a containing element, asking it to lay out its children as grid items. That’s what display: grid means. It means “make me a block level container with grid item children”. Those child elements then behave in the way brought to us by grid layout.

当您要使用网格布局时,您正在做的是更改包含元素的display属性,要求它将其子元素布置为网格项。 那就是display: grid意思。 这意味着“让我成为带有网格项子项的块级容器”。 这些子元素然后以网格布局为我们带来的方式运行。

The same is true if you say display: flex, except those child elements behave like flex items.

如果您说display: flex ,则同样如此,除了那些子元素的行为类似于flex项目。

In both cases, the children of those flex and grid items go right back to normal flow. The block and inline layout that elements use by default on the web. This is the reason why if you write some HTML it doesn’t all mush together in one long unreadable line.

在这两种情况下,这些flex和grid项的子项都将恢复正常流动。 元素在网络上默认使用的块和行内布局。 这就是为什么如果您编写一些HTML并不能将它们全都拼成一条长长的不可读行的原因。

If you don’t want the children to go to normal flow, then you can change their display value. Make your grid item become a grid container itself. The idea behind the subgrid feature of grid layout is that it will be possible to opt those grid items which have become a grid container into the track sizing defined on their parent grid - if you want to - rather than defining grid-template-columns or grid-template-rows for that new set of grid items to sit on.

如果您不希望孩子们正常使用,则可以更改他们的显示值。 使您的网格项目成为网格容器本身。 网格布局的子网格功能背后的想法是,有可能将那些已成为网格容器的网格项目选择为其父网格上定义的轨道大小(如果需要),而不是定义grid-template-columns或新的一组网格项所在的grid-template-rows

Semantic markup creates these nested structures, we then decide which layout method we want to use to lay out the content we create. So while nesting grids is a quick way to explain a structure, it’s not something special we are doing. We’re just using CSS to change the value of display, one level at a time.

语义标记创建了这些嵌套结构,然后我们决定要使用哪种布局方法来布置我们创建的内容。 因此,尽管嵌套网格是解释结构的快速方法,但我们所做的并不是什么特别的事情。 我们只是使用CSS 一次一次更改display的值。

If you want to compare that to HTML tables as used for layout, and I lived through that era, we were doing something very different. There we would create a table structure, often tables within tables, and then poke our content into the gaps we had created. We weren’t taking semantic HTML and changing the display method used on it, we were creating a layout structure in HTML then shoving our design into the gaps, shattering it into bits as we did so. We removed all sensible order and structure, rendering it inaccessible to screen readers or anything trying to parse that information.

如果您想将其与用于布局HTML表进行比较,而我经历了那个时代,我们所做的事情就大不相同了。 在那里,我们将创建一个表结构,通常是表中的表,然后将内容戳入我们已创建的空白中。 我们不是在使用语义HTML并更改其上使用的显示方法,而是在HTML中创建布局结构,然后将我们的设计推到空隙中,然后像这样将其粉碎成碎片。 我们删除了所有合理的顺序和结构,使屏幕阅读器或任何试图解析该信息的人员无法访问它。

So do not worry, talk of nesting grids has nothing to do with nested tables.

因此,不必担心,谈论嵌套网格与嵌套表无关。

If you want to understand more about display I have kicked off a little series over at Smashing Magazine with Digging Into The Display Property: The Two Values of Display. To learn about subgrid, I have an article about subgrid too, and most of my talks this year cover subgrid in some way.

如果您想了解有关display更多信息,我将在Smashing Magazine上探讨“显示属性:显示的两个值 ”,以揭开序幕。 要了解subgrid,我也有一篇有关subgrid的文章今年我的大部分演讲都以某种方式涵盖了subgrid。

翻译自: https://rachelandrew.co.uk/archives/2019/04/12/are-nested-grids-like-nested-tables/

wrf嵌套网格domain

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值