Como criar e verificar um gradiente CSS.
Um gradiente deve especificar direção, pontos de cor e superfície pretendida. Verifique o contraste em todos os lugares onde o texto aparece sobre ele e forneça uma cor sólida alternativa quando o design exigir.
Adapte o fluxo à sua tarefa.
Especifique a superfície, direção, pontos de cor e cor alternativa e gere a declaração CSS. Teste o gradiente inteiro atrás de qualquer conteúdo sobreposto e examine o recorte responsivo. Avalie o contraste do texto separadamente do apelo visual do fundo.
- O que você fornece
- Cores, direção e requisitos visuais.
- O que você recebe
- Gradiente CSS válido com parâmetros editáveis.
Veja a entrada e o resultado.
Entrada e saída ilustrativas · exemplo didático, não uma execução real do WebAct
Exemplo campo
Create a left-to-right background from #fff7ed to #fed7aa, with a solid fallback.
Exemplo completo
background-color: #fff7ed; background-image: linear-gradient(90deg, #fff7ed 0%, #fed7aa 100%); Check any foreground text against the full gradient, not just one endpoint.
Carregue esta entrada no prompt e copie para o WebAct para testar a tarefa. Seu resultado pode ser diferente da ilustração.
Decisões e solução de problemas.
Verificar o contraste em apenas uma extremidade do gradiente basta para o texto sobreposto?
Não. O texto pode atravessar uma parte diferente ou de menor contraste do gradiente. Teste as posições e os estados reais.
Por que a direção do gradiente difere do layout pretendido?
As convenções dos ângulos e a geometria do elemento afetam a aparência. Renderize a declaração na superfície de destino e examine o resultado.
Teste com sua própria fonte.
Substitua o exemplo pelo seu material no prompt. Mantenha os requisitos necessários e copie a tarefa para o WebAct.
Personalizar e copiar a tarefa ↑