AEM 6.4 chegou ao fim do suporte estendido e esta documentação não é mais atualizada. Para obter mais detalhes, consulte nossa períodos de assistência técnica. Encontre as versões compatíveis here.
Os formulários HTML5 são renderizados usando recursos HTML5 e o estilo do formulário renderizado é feito usando CSS. A aparência padrão de um formulário HTML5 é semelhante à sua representação de PDF. Os desenvolvedores podem usar o CSS personalizado para alterar a aparência padrão dos formulários HTML5.
Este artigo fornece informações passo a passo para alterar o estilo de um formulário HTML5 e Introdução aos estilos este artigo contém informações detalhadas sobre vários aspectos de estilo de formulários HTML5. Leia a Introdução ao artigo de estilos antes de executar as etapas mencionadas neste artigo.
As duas imagens a seguir mostram a diferença entre os estilos padrão e personalizado.
Escolha um perfil para adicionar estilos personalizados
Acesse a interface CRX DE no URL: https://<server>:<port>/crx/de e criar um perfil ou escolher um perfil existente. Para saber como criar um perfil, consulte Criação de um novo perfil
Crie uma folha de estilos CSS para estilizar os formulários HTML5
Navegue até a pasta em que você criou o renderizador de perfil e crie um arquivo de folha de estilos CSS. As etapas a seguir são
Para saber quais classes CSS CSS criar para um componente específico em seus formulários do HTML5, consulte Introdução aos estilos.
Incluir a folha de estilos no Renderizador de perfis
Abra a página Renderizador de perfil (arquivo jsp) no CRX DE e inclua o arquivo CSS na página logo abaixo da biblioteca do cliente XFA. Execute essas etapas para incluir o arquivo CSS no perfil.
Pesquise na página do renderizador a seguinte linha:
<cq:includeClientLib categories="xfaforms.profile" />
Insira o seguinte abaixo da linha acima para incluir a folha de estilos:
<link href="/path/to/stylesheet" rel="stylesheet" type="text/css"/>
Salve o arquivo.