Skip to content

Commit 3f803b0

Browse files
anteriovieirakazupon
authored andcommitted
Added info about deep selectors (#867)
1 parent 9b358e3 commit 3f803b0

File tree

1 file changed

+16
-0
lines changed

1 file changed

+16
-0
lines changed

docs/pt_BR/features/scoped-css.md

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -49,3 +49,19 @@ Para o seguinte:
4949
4. **Os estilos com escopo não eliminam a necessidade de classes**. Devido a forma como navegadores processam vários seletores CSS, `p { color: red }` irá ser muitas vezes mais lento quando com escopo \(exemplo: quando combinado com um seletor de atributo\). Se você usa classes ou ids ao invés, como em `.example { color: red }`, então você elimina praticamente esse desempenho atingido. [Aqui está um playground](http://stevesouders.com/efws/css-selectors/csscreate.php) onde você pode testar as diferenças você mesmo.
5050

5151
5. **Tenha cuidado com seletores descendentes em componentes recursivos!** Para uma regra CSS com o seletor `.a .b`, se o elemento que coincide com `.a` contém um componente filho recursivo, então todos os `.b` nesse componente filho serão correspondidos pela regra.
52+
53+
6. Se você precisa de seletores aninhados em estilos `scoped`, você terá que usar o operador `>>>` para CSS e `/deep/` para `scss`:
54+
55+
``` html
56+
<style scoped>
57+
.a >>> .b {
58+
59+
}
60+
</style>
61+
62+
<style lang="scss" scoped>
63+
.a /deep/ .b {
64+
65+
}
66+
</style>
67+
```

0 commit comments

Comments
 (0)