Codes proposés pour une fiche de lien

Code:

<link href="https://coderps.xyz/codesrps/sarahlien.css" rel="stylesheet" type="text/css" /><link href="https://fonts.googleapis.com/css?family=Bebas+Neue|Playfair+Display&display=swap" rel="stylesheet"><style> .koala{ text-align:center; display:block; letter-spacing:9px; font-size:7px; } .sarahlien h3{ background-color:#334F5D; } .sarahlien img{ border-color:#45B1A1; }</style><div class="sarahlien" style="margin:0 auto;"><div><img src="https://i.servimg.com/u/f78/19/41/85/33/319.png"><span style="color:#45B1A1;">Prénom Nom</span></div><div><h3>Infos</h3><h3>Infos</h3><h3>Infos</h3><h3>Infos</h3>
<p style="border-color:#334F5D;">Exorcizamus te, omnis immundus spiritus, omnis satanica potestas omnis incursio infernalis adversarii. Omnis legio! Omnis con...potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis......legio diabolica, adiuramus te! Exorcizamus te, omnis immundus spiritus, omnis satanica potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis legio diabolica, adiuramus te!"</p></div></div><a href="https://pisrale.forumactif.com/" class="koala">KoalaVolant</a>

Aperçu:

Code:

<link href="https://coderps.xyz/codesrps/kykylienlien.css" rel="stylesheet" type="text/css" /><style>.kykylien div, .kykylien img{ height:200px; } .kykylien div h1{font-family: 'Playfair Display', serif; margin-top:-200px; background-color:#334F5D; color:#fff;} .kykylien div span{ height:150px; }</style><div class="kykylien"><div><img src="https://i.servimg.com/u/f62/19/45/51/53/kykyle10.png"><h1>Prénom P. Nom</h1><span> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce risus elit, pharetra eu posuere ut, commodo sit amet nibh. Sed vel odio ut mauris luctus lacinia at a ex. Aliquam eget tortor risus. Nullam accumsan eu magna dictum lacinia. Aenean facilisis ligula porttitor elit hendrerit aliquet. Nunc efficitur faucibus mi quis venenatis. Praesent ut lacus accumsan, lacinia lacus quis, malesuada velit. Etiam vulputate lorem neque, quis sollicitudin purus tristique mattis. Donec pretium id ex a tincidunt. Suspendisse tortor velit, ultrices ut nisl a, lobortis mollis tellus. Mauris felis dui, finibus id urna quis, tempus condimentum lorem.

Cras pretium dolor ut justo viverra, eget vestibulum nisl ornare. Aliquam dapibus gravida condimentum. Vivamus ac tellus eu nulla posuere euismod. Cras ligula arcu, commodo vitae molestie a, blandit id arcu. Vestibulum ornare purus erat, quis molestie risus sollicitudin at. Fusce sagittis dui quis convallis iaculis. Maecenas sit amet nunc tempus ex sodales accumsan non eu lectus. In luctus ipsum diam, ac molestie lacus cursus et. </span></div><div><img src="https://i.servimg.com/u/f62/19/45/51/53/kykyle10.png"><h1>Prénom P. Nom</h1><span> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce risus elit, pharetra eu posuere ut, commodo sit amet nibh. Sed vel odio ut mauris luctus lacinia at a ex. Aliquam eget tortor risus. Nullam accumsan eu magna dictum lacinia. Aenean facilisis ligula porttitor elit hendrerit aliquet. Nunc efficitur faucibus mi quis venenatis. Praesent ut lacus accumsan, lacinia lacus quis, malesuada velit. Etiam vulputate lorem neque, quis sollicitudin purus tristique mattis. Donec pretium id ex a tincidunt. Suspendisse tortor velit, ultrices ut nisl a, lobortis mollis tellus. Mauris felis dui, finibus id urna quis, tempus condimentum lorem.

Cras pretium dolor ut justo viverra, eget vestibulum nisl ornare. Aliquam dapibus gravida condimentum. Vivamus ac tellus eu nulla posuere euismod. Cras ligula arcu, commodo vitae molestie a, blandit id arcu. Vestibulum ornare purus erat, quis molestie risus sollicitudin at. Fusce sagittis dui quis convallis iaculis. Maecenas sit amet nunc tempus ex sodales accumsan non eu lectus. In luctus ipsum diam, ac molestie lacus cursus et. </span></div><div><img src="https://i.servimg.com/u/f62/19/45/51/53/kykyle10.png"><h1>Prénom P. Nom</h1><span> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce risus elit, pharetra eu posuere ut, commodo sit amet nibh. Sed vel odio ut mauris luctus lacinia at a ex. Aliquam eget tortor risus. Nullam accumsan eu magna dictum lacinia. Aenean facilisis ligula porttitor elit hendrerit aliquet. Nunc efficitur faucibus mi quis venenatis. Praesent ut lacus accumsan, lacinia lacus quis, malesuada velit. Etiam vulputate lorem neque, quis sollicitudin purus tristique mattis. Donec pretium id ex a tincidunt. Suspendisse tortor velit, ultrices ut nisl a, lobortis mollis tellus. Mauris felis dui, finibus id urna quis, tempus condimentum lorem.

Cras pretium dolor ut justo viverra, eget vestibulum nisl ornare. Aliquam dapibus gravida condimentum. Vivamus ac tellus eu nulla posuere euismod. Cras ligula arcu, commodo vitae molestie a, blandit id arcu. Vestibulum ornare purus erat, quis molestie risus sollicitudin at. Fusce sagittis dui quis convallis iaculis. Maecenas sit amet nunc tempus ex sodales accumsan non eu lectus. In luctus ipsum diam, ac molestie lacus cursus et. </span></div><div><img src="https://i.servimg.com/u/f62/19/45/51/53/kykyle10.png"><h1>Prénom P. Nom</h1><span> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce risus elit, pharetra eu posuere ut, commodo sit amet nibh. Sed vel odio ut mauris luctus lacinia at a ex. Aliquam eget tortor risus. Nullam accumsan eu magna dictum lacinia. Aenean facilisis ligula porttitor elit hendrerit aliquet. Nunc efficitur faucibus mi quis venenatis. Praesent ut lacus accumsan, lacinia lacus quis, malesuada velit. Etiam vulputate lorem neque, quis sollicitudin purus tristique mattis. Donec pretium id ex a tincidunt. Suspendisse tortor velit, ultrices ut nisl a, lobortis mollis tellus. Mauris felis dui, finibus id urna quis, tempus condimentum lorem.

Cras pretium dolor ut justo viverra, eget vestibulum nisl ornare. Aliquam dapibus gravida condimentum. Vivamus ac tellus eu nulla posuere euismod. Cras ligula arcu, commodo vitae molestie a, blandit id arcu. Vestibulum ornare purus erat, quis molestie risus sollicitudin at. Fusce sagittis dui quis convallis iaculis. Maecenas sit amet nunc tempus ex sodales accumsan non eu lectus. In luctus ipsum diam, ac molestie lacus cursus et. </span></div><div><img src="https://i.servimg.com/u/f62/19/45/51/53/kykyle10.png"><h1>Prénom P. Nom</h1><span> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce risus elit, pharetra eu posuere ut, commodo sit amet nibh. Sed vel odio ut mauris luctus lacinia at a ex. Aliquam eget tortor risus. Nullam accumsan eu magna dictum lacinia. Aenean facilisis ligula porttitor elit hendrerit aliquet. Nunc efficitur faucibus mi quis venenatis. Praesent ut lacus accumsan, lacinia lacus quis, malesuada velit. Etiam vulputate lorem neque, quis sollicitudin purus tristique mattis. Donec pretium id ex a tincidunt. Suspendisse tortor velit, ultrices ut nisl a, lobortis mollis tellus. Mauris felis dui, finibus id urna quis, tempus condimentum lorem.

Cras pretium dolor ut justo viverra, eget vestibulum nisl ornare. Aliquam dapibus gravida condimentum. Vivamus ac tellus eu nulla posuere euismod. Cras ligula arcu, commodo vitae molestie a, blandit id arcu. Vestibulum ornare purus erat, quis molestie risus sollicitudin at. Fusce sagittis dui quis convallis iaculis. Maecenas sit amet nunc tempus ex sodales accumsan non eu lectus. In luctus ipsum diam, ac molestie lacus cursus et. </span></div></div>

Aperçu: