كود لوحة إعلانية بدون صور

01052021

بسم الله الرحمن الرحيم

السلام عليكم و رحمة الله و بركاته

أضع لكم هنا كود لتصميم إعلانات لوحة بنرية بدون صور من أجمل تصفح سريع للموقع.

للمشاهدة

https://codepen.io/KhaledDaif/full/yLgdxxV

الكود

الكود:


<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Lalezar&display=swap" rel="stylesheet">
<a style="text-decoration: none;" href="#"><p style="background:linear-gradient(30deg, #7c57a2, #13bdce);
  border-radius:0px;
  border: 1px solid #eee;
  box-shadow: -1px -1px 0px #aaa,
    1px 1px 0px #aaa,
    1px -1px 0px #aaa,
    -1px 1px 0px #aaa;
  height:60px;
  width:150px;
  margin:auto;
  text-align:center;
  line-height: 2;
  font-family: lalezar, tahoma;
  font-size: 16px;
  color:#eee;
  text-shadow: 1px 1px 0 #222;
  transition:0.2;">
  
  
  ضع إعلانك هنا
<br>150 X 60
  </p></a>
<br>
<a style="text-decoration: none;" href="#"><p style="background:linear-gradient(45deg, #ee4d74, #f58c58);
  border-radius:0px;
  border: 1px solid #eee;
  box-shadow: -1px -1px 0px #f58c58,
    1px 1px 0px #f58c58,
    1px -1px 0px #f58c58,
    -1px 1px 0px #f58c58;
  height:90px;
  width:728px;
  margin:auto;
  text-align:center;
  line-height: 2;
  font-family: lalezar, tahoma;
  font-size: 24px;
  color:#ffeeee;
  text-shadow: 2px 2px 0 #222;
  transition:0.2;">
  
  
  ضع إعلانك هنا
<br>728 X 90
  </p></a>