Tableau HTML avec effet d'ombre SANS CSS - HTML/CSS - Programmation
Marsh Posté le 10-04-2024 à 13:10:26
Si tu peux ajoute du html tu peux surement ajouter du css, tu as essayé d'ajouter une balise style dans ton contenu html ?
Code :
|
Sinon apparemment tu peux mette du inline dans tes td mais répéter ta règle pour chaque cellule...
Sinon utiliser des tableaux pour de la mise en page c'est des techniques des année 90, il y'a bien mieux maintenant (et des techniques qui s'adaptent au smartphone ).
Marsh Posté le 10-04-2024 à 13:29:23
Je vais essayer ça.
Pour le inline (je ne connais ce terme que depuis peu), j'ai essayé mais sans succès non plus. Je sais pour les tableaux, mais je ne suis pas un expert de base et en plus, bon nombre d'alternatives ne passaient pas Mais si sur ces deux choses-là tu as des suggestions, je suis tout à fait preneur !
Merci beaucoup pour ton aide
Marsh Posté le 10-04-2024 à 15:49:03
K-SUP
J'ai essayé ton code, ça fonctionne ! seul hic, cest que c'est coupé sur les bords si c'est trop près de la frontière entre le menu latéral de gauche et le reste. Faut juste que j'ajoute un petit padding externe je suppose !
Marsh Posté le 10-04-2024 à 16:10:19
Ah ben bien si les balises style fonctionne...
Par contre je ne connais pas ce CMS, j'ai cherché un peu sur leur support mais je ne vois pas trouvé de partie customisation graphique.
Ça parle bien de template d'affichage et d'extension mais je tu n'est peut être même pas sur la dernière version...
Et un truc comme ça ?
Code :
|
Pacqu'un tableau avec une seule cellule comment dire...
Marsh Posté le 10-04-2024 à 16:26:12
Pas mal aussi !
Par contre toujours ce même souci de shadow mangée sur les côtés :
Donc le margin et le padding n'ont pas l'air de fonctionner
Edit : si ! J'ai juste enlever les coquilles (si c'en était) sur la ligne :
div#content div.bloc {background:#f2f2f2;text-align:center; margin:23px; padding:20px; box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;} |
Il fallait également mettre 3 px de plus dans le margin et 10 dans le padding
Marsh Posté le 10-04-2024 à 16:38:16
Tout roule nickel, j'ai enlevé les attributs a et a:hover pour conserver les couleurs de la charte graphique et tout est nickel.
MERCI @mechkurt !
Marsh Posté le 10-04-2024 à 16:41:50
Tu peux bidouiller pour trouver les bonnes valeurs en utilisant la fonction de développement web de ton navigateur (clic droit inspecter).
https://www.google.com/search?q=inspecteur+navigateur
Et maintenant à toi les joies du CSS ! ^^
https://www.google.com/search?q=tuto+css
Edit:de rien, n’hésite pas si tu as d'autres questions
Marsh Posté le 11-04-2024 à 22:57:46
Y'a peut-être moyen de faire charger un fichier CSS via du javascript (balise <script> dans le HTML) et zou, tu peux faire ce que tu veux.
L'autre solution serait de changer de CMS peut-être
Marsh Posté le 12-04-2024 à 10:31:39
Changer de CMS n'est pas du tout à ma portée Mais j'aimerais bien...
Marsh Posté le 12-04-2024 à 12:13:02
Installer un Wordpress, c'est pas comme s'il n'y avait pas 50 tutos qui expliquent comment faire
Marsh Posté le 10-04-2024 à 09:57:54
Gestionnaire web d'un site propulsé par
WordPressun CMS très limitatif en termes de personnalisation, je cherche à abreuver mes pages d'un peu plus de style que les simples mises en forme par défaut qui se montrent sommaires, basiques et très peu nombreuses.J'ai une contrainte énorme : pas moy' d'y ajouter du CSS.
J'ai déjà ajouter quelques bricolages, comme un simple encadré sur fond coloré (gris en l'occurrence), créé à base d'un simple tableau composé d'une seule colonne et une seule ligne :
<table cellpadding="33" style="width:100%; border:none">
<tbody>
<tr>
<td bgcolor="#f2f2f2" style="text-align: center;" valign="top" width="20%">
<h2 style="text-align: left;">Un titre ici</h2>
<div style="text-align: left;">Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte Texte</div>
 
</td>
</tr>
</tbody>
</table>
Ce que je souhaiterais, c'est avoir ce même type d'encadré sur fond blanc mais avec un effet d'ombre autour. Est-ce que c'est possible via un simple éditeur HTML ? J'ai essayé de croiser plusieurs résultats de recherche sur le sujet, rien de concluant.
Le but serait d'arriver à un résultat comme ce qu'on peut trouver sur cette page : https://getcssscan.com/css-box-shadow-examples
(exemples : 5, 6, 18, 23...)
Preneur de vos tips
Message édité par Yeam le 10-04-2024 à 09:58:05
---------------
— TOPIC ACHATS/VENTES —