Comment l'utiliser
- Ouvrez l'onglet Tableau pour construire un tableau, ou l'onglet Box Shadow pour une ombre.
- Pour un tableau, définissez le nombre de lignes et de colonnes, la largeur du tableau et l'épaisseur de la bordure. Pour une ombre, déplacez les curseurs de décalage, de flou et d'étendue.
- Vérifiez l'aperçu, puis utilisez l'icône de copie au-dessus du bloc de code.
L'onglet Tableau crée un tableau HTML avec une ligne d'en-tête et le nombre de lignes de corps et de colonnes que vous définissez. Les cellules d'en-tête sont remplies avec du texte comme Header 1 et les cellules du corps avec du texte comme Cell 1-1, que vous remplacez par votre propre contenu. Le champ de largeur accepte n'importe quelle valeur de largeur CSS, avec 100% par défaut, et le champ de bordure fixe l'épaisseur de la bordure en pixels. Le code copié commence par un bloc de style pour une classe nommée gen-table qui définit des bordures fusionnées, un espacement des cellules, un en-tête ombré, des lignes paires rayées et une couleur de survol, suivi du balisage du tableau.
L'onglet Box Shadow produit une unique déclaration box-shadow. Vous contrôlez le décalage horizontal et le décalage vertical (-50 à 50 px), le rayon de flou (0 à 100 px), l'étendue (-50 à 50 px), la couleur de l'ombre sous forme de valeur de couleur CSS et une option inset pour une ombre intérieure. La couleur par défaut est un noir transparent clair. La boîte d'aperçu se met à jour pendant que vous déplacez les curseurs.
Les deux onglets affichent le code dans un bloc avec un bouton de copie. Le nombre de lignes et de colonnes doit être d'au moins 1, et la valeur de bordure d'au moins 0.
Le code est généré dans votre navigateur et rien n'est envoyé.
FAQ
Le tableau est-il fourni avec une mise en forme ?
Oui. La sortie inclut un bloc de style pour la classe gen-table, avec bordures, marges, en-tête ombré, lignes rayées et couleur de survol. Vous pouvez le modifier ou le supprimer.
Puis-je fusionner des cellules ou ajouter des légendes ?
Non. Le générateur crée une grille simple avec une ligne d'en-tête. Modifiez le balisage copié si vous avez besoin de plus.
À quoi sert la valeur d'étendue dans une ombre ?
Elle agrandit ou réduit l'ombre avant le flou. Les valeurs positives l'agrandissent et les valeurs négatives la réduisent.
Puis-je créer une ombre intérieure ?
Oui. Cochez l'option inset et la sortie se termine par le mot-clé inset.
Ma saisie est-elle envoyée quelque part ?
Non. Le code est construit dans votre navigateur.