Primeiras renderizações anteriores:
Para definir essa borda, você pode usar diretamente a propriedade border-image em vez de cortar a borda inteira para criar uma imagem de plano de fundo. As etapas são as seguintes:
1. Recorte a unidade pequena com imagens de borda repetidas, como mostrado abaixo:
2. Defina o estilo CSS:
origem da imagem da borda: url (../ img / border_img.png);
fatia da imagem da borda: 0 0 100% 0;
borda-imagem-largura: 0.05rem;
border-image-repeat: repita;
A combinação desses atributos pode ser escrita como:
imagem da borda: url (../ img / border_img.png) 0 0 100% / 0,05rem 0 repetição;
3. Se você deseja que essa borda única fique acima, basta modificar
fatia da imagem da borda: 100% 0 0 0;
