نبذه عن صاحب المدونه بالجافا

عدد المشاهدات الان

 ضعها بالمكان المناسب

الاضافه لـ إعداد اللغة HTML/JavaScript

<div class="aboutAuthor">

    <div class="K2_bio">

      <img alt="About Techyleaf" src="https://blogger.googleusercontent.com/img/a/AVvXsEgWbMp_6DTx-j9wlpuj858lpEqzkizVHK6VDvhHG1WIX_6DxXjcIeeJ0I4Oqe3JLyn8qVGMUb4ZF_dSU06cz-EQnD6_yb15zWaselHSjH9vTLEAIVKUgoPAeNIN0SF6P0wavViVZhix2ZU7phNgBeR9HLgEGzDAe1hSPfKOFKOZimT6JrjAxa3IUjGb">

      

      <h2> صاحب المدونه </h2>

      <p>هنا النبذه</p>

      

      <div class="k2About-bt">

        <a class="button" href="#"><svg class="K2svg" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg"><g><path d="M28.59,4.29a2.23,2.23,0,0,0-2.27-.36L3.41,13.1a1.83,1.83,0,0,0,0,3.38l1.48.61a1,1,0,0,0,1.31-.53,1,1,0,0,0-.54-1.31L4.56,14.8l22.51-9a.22.22,0,0,1,.23,0,.24.24,0,0,1,.08.23L23.27,25.21a.4.4,0,0,1-.26.3.39.39,0,0,1-.39-.06l-8-6.24,7.83-7.91a1,1,0,0,0-1.22-1.56L9.75,16.54a1,1,0,1,0,1,1.72l4.83-2.85L13.23,17.8a2,2,0,0,0,.2,3.08l8,6.15a2.4,2.4,0,0,0,1.47.5,2.47,2.47,0,0,0,.83-.15,2.37,2.37,0,0,0,1.52-1.75L29.33,6.47A2.23,2.23,0,0,0,28.59,4.29Z"></path></g></svg> حياكم الله</a>

      </div>

    </div>

  </div>

  <style>

  .aboutAuthor {

      padding: 60px 0 20px 0;

  }

  .aboutAuthor .K2_bio {

      justify-content: center;

      position: relative;

      display: flex;

      flex-direction: column;

      justify-content: center;

      align-content: center;

      align-items: center;

      max-width: 95%;

      margin: auto;

      padding: 80px 15px 65px 15px;

      /*background-color: #FFF;*/

      box-shadow: 0 10px 40px rgba(149,157,165,.2);

      border-radius: 20px;

      border: 5px solid #404040;

  }

  .aboutAuthor .K2_bio img {

      background-image: linear-gradient(to top right,#ffffff,#ffa24d);

      box-shadow: 0 5px 20px rgba(0,0,0,.2);

      padding: 0;

      border: 7px solid #ffc2b4;

      width: 120px;

      height: 120px;

      position: absolute;

      border-radius: 50%;

      top: -60px;

      pointer-events: none;

      

  }

     .aboutAuthor .K2_bio h2{

    margin:0px!important;

      padding: 0;

    }

  .aboutAuthor .K2_bio p {

      margin: 1em 0!important;

      text-align: center;

  }

  .aboutAuthor .K2_bio .k2About-bt {

      text-align: center;

      position: absolute;

      bottom: 0;

      left: 0;

      right: 0;

  }

  .k2About-bt svg  {

      width: 22px;

      height: 22px;

      fill: #FFF;

    margin-right:3px;

  }  

   .darkmoade .aboutAuthor .K2_bio {

    background-color: var(--dark-bgAlt);

    }

  </style>

غير الخط والصوره والحجم وسلامتكم

اذا حبيت نسخ المقالهـ