الثلاثاء، 6 نوفمبر 2018

احصل على هذة الاداة من هنا

تأثير الاضائة على النصوص



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


 نعود لكم بتدوينة جديدة نقدم لكم فيها تأثير
جد احترافي عبارة كود css يضفي اضاءة على
الحروف أو النصوص





طريقة التركيب:

    1. توجه الى التخطيط ثم اضف اداة html/javascript (بالسايد بار)
    2. ضع كود التالي داخل الاداة


      <style>
      .neon {
        font-family: 'toyor-aljanah';
        color: #FB4264;
        font-size: 15vw;
        line-height: 16vw;
        text-shadow: 0 0 3vw #F40A35;
      }
      
      .flux {
        font-family: neon;
        color: #426DFB;
        font-size: 9vw;
        line-height: 9vw;
        text-shadow: 0 0 3vw #2356FF;
      }
      
      .neon {
        animation: neon 1s ease infinite;
        -moz-animation: neon 1s ease infinite;
        -webkit-animation: neon 1s ease infinite;
      }
      
      @keyframes neon {
        0%,
        100% {
          text-shadow: 0 0 1vw #FA1C16, 0 0 3vw #FA1C16, 0 0 10vw #FA1C16, 0 0 10vw #FA1C16, 0 0 .4vw #FED128, .5vw .5vw .1vw #806914;
          color: #FED128;
        }
        50% {
          text-shadow: 0 0 .5vw #800E0B, 0 0 1.5vw #800E0B, 0 0 5vw #800E0B, 0 0 5vw #800E0B, 0 0 .2vw #800E0B, .5vw .5vw .1vw #40340A;
          color: #806914;
        }
      }
      
      .flux {
        animation: flux 2s linear infinite;
        -moz-animation: flux 2s linear infinite;
        -webkit-animation: flux 2s linear infinite;
        -o-animation: flux 2s linear infinite;
      }
      
      @keyframes flux {
        0%,
        100% {
          text-shadow: 0 0 1vw #1041FF, 0 0 3vw #1041FF, 0 0 10vw #1041FF, 0 0 10vw #1041FF, 0 0 .4vw #8BFDFE, .5vw .5vw .1vw #147280;
          color: #28D7FE;
        }
        50% {
          text-shadow: 0 0 .5vw #082180, 0 0 1.5vw #082180, 0 0 5vw #082180, 0 0 5vw #082180, 0 0 .2vw #082180, .5vw .5vw .1vw #0A3940;
          color: #146C80;
        }
      }
      
      </style>
      <div class="neon">عصام </div>
        <div class="flux">WEEB </div>


        1. ثم قم بتغيير ما يلي                                                 
        2. عصام WEEB بما يناسبك
        3. كما يمكنك اضافة التأثير على أي نص بمدونتك فقط بالتعديل على أكواد CSS


        1. اذا واجهت اي مشكلة ضعها بتعليق


      هناك تعليق واحد


      EmoticonEmoticon