Vous cherchez une fiche à l'élégance et à l'aspect véritablement "noble" ? En voici une. Sachant que les images sont bien sûr modifiables, comme l'image de contour, et si vous voulez vous amuser à modifier les arabesques, c'est bien sûr possible.

HTML

Code:

<link href="https://fonts.googleapis.com/css?family=Niconne" rel="stylesheet"><style>.koala{display:flex; justify-content:center; font-size:8px; letter-spacing:5px; }</style><div class="pres_nfa"><span class="nfa_img"><h1>Titre</h1></span>
<div class="contenu_nfa"><div><img src="https://66.media.tumblr.com/4216a4c0fcd8e01378b1566f2764aa45/tumblr_o7w2veChcr1runoqyo6_540.gif" class="baseimg">

Exorcizamus te, omnis immundus spiritus, omnis satanica potestas, omnis incursio infernalis adversarii, omnis legio, omnis congregatio et secta diabolica. Ergo, omnis legio diabolica, adiuramus te... cessa decipere humanas creaturas, eisque æternæ perditionìs venenum propinare... Vade, satana, inventor et magister omnis fallaciæ, hostis humanæ salutis... Humiliare sub potenti manu Dei; contremisce et effuge, invocato a nobis sancto et terribili nomine... quem inferi tremunt... Ab insidiis diaboli, libera nos, Domine. Ut Ecclesiam tuam secura tibi facias libertate servire, te rogamus, audi nos.

<h2>Il me faut un sous titre</h2>
<img src="https://i.servimg.com/u/f30/19/45/51/53/arabmi10.png" class="armil">

Exorcizamus te, omnis immundus spiritus, omnis satanica potestas, omnis incursio infernalis adversarii, omnis legio, omnis congregatio et secta diabolica. Ergo, omnis legio diabolica, adiuramus te... cessa decipere humanas creaturas, eisque æternæ perditionìs venenum propinare... Vade, satana, inventor et magister omnis fallaciæ, hostis humanæ salutis... Humiliare sub potenti manu Dei; contremisce et effuge, invocato a nobis sancto et terribili nomine... quem inferi tremunt... Ab insidiis diaboli, libera nos, Domine. Ut Ecclesiam tuam secura tibi facias libertate servire, te rogamus, audi nos.</div></div>
<koala>KoalaVolant</koala>

CSS

Code:

.pres_nfa{
  width:500px;
  margin:0 auto;
}

.armil{
  width:190px;
  height:51px;
  margin:0 auto;
  display:block;
}

.contenu_nfa strong, .contenu_nfa b{
  color:#BA941F;
}

.pres_nfa *{
  box-sizing:border-box;
}

.pres_nfa .nfa_img{
  display:block;
  height:124px;
  width:500px;
  background-image:url('https://i.servimg.com/u/f30/19/45/51/53/detout12.png');
  padding-top:32px;
}

.pres_nfa h1{
  color:#BA941F;
background-color:#fff;
  padding:2px;
  box-shadow:#fff 0px 0px 5px;
  border-radius:20px;
  font-weight:normal;
  font-family: 'Niconne', cursive;
  font-size:35px;
  text-align:center;
  letter-spacing:2px;
  line-height:28px;
}

.pres_nfa h2{   font-family: 'Niconne', cursive; text-align:center; font-size:23px; border-bottom:1px solid #DCB02C;
  padding-bottom:2px; color:#DCB02C; margin:5px 0px; font-weight:normal;}

koala{
  font-family:Century Gothic;
  font-size:9px;
  letter-spacing:5px;
  margin-top:-15px;
  text-align:center;
  display:block;
}

.contenu_nfa{
  border-top:#cdaf33 3px solid;
    border-bottom:#cdaf33 3px solid;
  border-image: url('https://i.servimg.com/u/f30/19/45/51/53/1210.jpg') 50 round;
  border-left:none; border-right:none;
  margin-top:-25px;
  background-image:url('https://i.servimg.com/u/f30/19/45/51/53/1210.jpg');
}

.contenu_nfa div{
  padding:25px;
  font-family:Verdana;
  font-size:12px;
  line-height:15px;
  background-color:#fff;
  color:#3C3C3C;
  width:450px;
  margin:0 auto;
}

.baseimg{
  width:100%;
  height:175px;
  object-fit:cover;
}