Atributo border-inline-start-style CSS
- Página anterior border-inline-start-color
- Próxima página border-inline-start-width
Definição e uso
Define a direção inline. Isso afeta a posição de início e fim de uma linha, bem como
definir e ajustar o estilo da borda do elemento no início da direção interna.
propriedades CSS Define a direção inline. Isso afeta a posição de início e fim de uma linha, bem como
A propriedade está relacionada a border-bottom-style
、border-left-style
、border-right-style
text-orientation border-top-style
As propriedades são muito semelhantes, mas Define a direção inline. Isso afeta a posição de início e fim de uma linha, bem como
A propriedade depende da direção interna.
Atenção:Propriedades CSS relacionadas A posição da borda de início da direção inline é afetada por
、、
text-orientation A posição da borda de início e fim da direção inline é afetada por
e Define a direção inline. Isso afeta a posição de início e fim de uma linha, bem como
border-inline-start-style
Resultados da propriedade. Para páginas em inglês, a direção inline é de esquerda para direita, e a direção de bloco é para baixo.
Exemplo
Exemplo 1
Impacto da propriedade: direction: rtl;
border-inline-start-style: dotted;
Defina o estilo da borda de início da direção inline:
Exemplo 2: Combinado com a propriedade writing-mode A posição da borda de início da direção inline é afetada por
direction
Impacto da propriedade: writing-mode direction: rtl;
border-inline-start-style: dotted;
writing-mode: vertical-rl;
Exemplo 3: Combinado com a propriedade direction A posição da borda de início e fim da direção inline é afetada por
direction
Impacto da propriedade: div { direction: rtl;
}
Experimente você mesmo
Sintaxe do CSS
border-inline-start-style: none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit; | Valor da propriedade |
---|---|
none | Valor |
Descrição | Valor padrão. Especifique borda nenhuma. |
hidden | Igual a none, mas diferente na resolução de conflitos de borda de elementos de tabela. |
dashed | Especifique borda pontilhada. |
solid | Especifique borda sólida. |
double | Especifique borda dupla. |
groove |
Especifique borda em sulco 3D. O efeito depende do valor de border-color. |
rigde |
Especifique borda elevada 3D. O efeito depende do valor de border-color. |
inset |
Especifique borda encaixada 3D. O efeito depende do valor de border-color. |
outset |
Especifique borda convexa 3D. O efeito depende do valor de border-color. |
initial | Defina essa propriedade para seu valor padrão. Veja initial. |
inherit | Herda essa propriedade do elemento pai. Veja inherit. |
Detalhes técnicos
Valor padrão: | none |
---|---|
Herança: | Não |
Produção de animação: | Não suportado. Veja:Propriedades relacionadas a animação. |
Versão: | CSS3 |
Sintaxe do JavaScript: | object.style.borderInlineStartStyle="dotted" |
Suporte do navegador
Os números na tabela representam a versão do navegador que suporta plenamente essa propriedade.
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
69.0 | 79.0 | 41.0 | 12.1 | 56.0 |
Páginas relacionadas
Tutorial:Borda CSS
Referência:Atributo CSS border
Referência:Atributo CSS border-inline
Referência:Atributo CSS border-inline-end-style
Referência:Atributo border-inline-start-style CSS
Referência:Atributo CSS border-bottom-style
Referência:Atributo border-left-style CSS
Referência:Atributo border-right-style CSS
Referência:Atributo border-top-style CSS
Referência:Atributo direction do CSS
Referência:A propriedade CSS text-orientation
Referência:A propriedade CSS writing-mode
- Página anterior border-inline-start-color
- Próxima página border-inline-start-width