Création d'une simple page web avec icone cliquable

[nexosenz]

Bonjour à tous

J'aurais besoin des compétences de l'un d'entre vous, afin de me créer une page web a priori toute simple dans sa conception.

Je souhaiterai cependant que son contenu s'adapte a la taille de l'ecran. Cette page est amené a etre affiché sur des pc avec des ecrans de taille différentes, et également sur IPAD.

Ce dont j'ai besoin est simple. Une page, un gros titre centré, et 5 (pour le moment) gros icone cliquable qui redirige vers une adresse web

un truc qui ressemble a ca :

1548087958.png (198.92 Kio) Vu 1054 fois

1548087958.png (198.92 Kio) Vu 1054 fois

Chaque icone est créé :

1548088036.png (28.93 Kio) Vu 1054 fois

1548088036.png (28.93 Kio) Vu 1054 fois

1548088037.png (23.46 Kio) Vu 1054 fois

1548088037.png (23.46 Kio) Vu 1054 fois

1548088038.png (73.42 Kio) Vu 1054 fois

1548088038.png (73.42 Kio) Vu 1054 fois

1548088039.png (96.83 Kio) Vu 1054 fois

1548088039.png (96.83 Kio) Vu 1054 fois

1548088069.png (23.52 Kio) Vu 1054 fois

1548088069.png (23.52 Kio) Vu 1054 fois

Il faudrait peu etre "embellir" le titre avec un cadre ou un fond, mais avec cette police simple (arial gras), et ajouter une couleur de fond

faudrait que ca fasse "pro", sobre, classe.

des petit detail comme le bouton qui s'enfonce quand on clic dessus ou ce genre de detail serait un plus mais pas forcement obligatoire si trop complexe

Quelqu'un serait il en mesure de me faire cela ?

merci de votre aide a tous

[Steph]

Salut,

En principe nous n’effectuons pas de chose de ce type à la demande, mais exceptionnellement je vais m’y pencher, car cela me parait simple dans l’ensemble.

Je reviens vers ce sujet dès que j’ai pu bosser dessus.

[nexosenz]

[Steph]

Hello,

Voilà un essai assez simpliste.

portail_ADC.zip

(298.04 Kio) Téléchargé 131 fois

portail_ADC.zip

(298.04 Kio) Téléchargé 131 fois

[nexosenz]

salut steph

franchement c'est génial. Le coup de la transparence avec la souris c'est parfait
j'ai étudié les fichiers et le pense les comprendre donc je suis capable d'ajouter d'autres icones.

2 petites questions malgré tout :

quel est la valeur a changer dans le css pour modifier l’écart horizontale entre 2 icônes ?
j'ai ajouté les url, j'aurais voulu que le site sur lequel on clique s'ouvre dans un nouvelle fenêtre, que dois je modifier ?

EDIT : une troisième ^^

Je vient d'ajouter 3 icones supplémentaires, et du coup ils vont en dessous (3 icones max par lignes sur le pc, et 2 max par ligne sur ipad retina)
j'aurais préféré 4 icônes par ligne dans les 2 cas.
sur quelles valeurs dois je jouer pour modifier pour cela ?

[Steph]

1. Il faut ajouter un par exemple un margin-right: 15px a la classe icône.
2. Ajoute targette="_blank" au code de l'URL
3. Jour sur le width de la classe "bloc_liens", pour 4 icônes tu multiplie 200 par le nombre d'icônes et tu rajoutes 50 px ou un peu plus.

Pour voir le résultat CTRL+F5

[nexosenz]

Salut steph

merci beaucoup j'ai réussi a avoir et faire a peu prêt ce que je veut. c'est nickel

merci encore

[Steph]

Hello,

N'hésite pas en cas de besoin

Et merci à toi pour ton geste appréciable