#29 CSS Gradients - CSS Full Tutorial

Поделиться
HTML-код
  • Опубликовано: 3 ноя 2024

Комментарии • 48

  • @DevDreamer
    @DevDreamer  4 года назад +13

    Thanks for watching! Be sure to smash the Like and Subscribe buttons 🙂👍
    If you found this video useful let me know below 👇also how do you plan on using CSS Gradients? 👇

  • @manojjrkhiara240
    @manojjrkhiara240 3 года назад +3

    You are a good teacher, thank u Sir
    Regards manoj india

  • @kiranshelar2961
    @kiranshelar2961 3 года назад +5

    Your content is so easy to follow ! Subscribed ! :)

  • @anthonyrobert1376
    @anthonyrobert1376 3 года назад +7

    hi, i just found your channel and i subscribed immeidately, keep up the great work

    • @DevDreamer
      @DevDreamer  3 года назад +2

      Hey Anthony, thank you so much 🙂👍

  • @roukawa
    @roukawa Год назад +1

    this course is very helpful to me thank u
    i hope to continue to another course's frame work

  • @SalamiRidwan-abolaji
    @SalamiRidwan-abolaji Месяц назад +1

    very nice lesson

  • @shivkounsalye3245
    @shivkounsalye3245 3 года назад +4

    It was a great experience on your first video brother...i had learnt exactly what i was looking for

    • @DevDreamer
      @DevDreamer  3 года назад

      Awesome Shiv! Thank you for watching, please subscribe if you haven't already 🙂👍

  • @FM-zf2fz
    @FM-zf2fz 2 года назад +1

    Merry Christmas. Very well explained.

  • @حياةع-ط8م
    @حياةع-ط8م 2 года назад +1

    Thank you for clear and simple explanation

  • @Sameer10563
    @Sameer10563 2 года назад +1

    thanks man, content precise and to the point, i subscribe

  • @Pho3nixsh09
    @Pho3nixsh09 3 года назад +5

    hey! I cant tell how much your channel helped me thanks! :)

    • @DevDreamer
      @DevDreamer  3 года назад

      Hey Viraj! These are the kind of comments that make what I'm doing worthwhile. I really appreciate your support brother, thank you and stay tuned 🙂👍

  • @flashsters
    @flashsters 7 месяцев назад

    Thanks a lot it's super helpful :) 😀😀😀😀😀😀😀. FYI we also have conic-gradients.

  • @ca-lt1fc
    @ca-lt1fc 3 года назад +1

    interesting and fun video! tx DD, you are the bomb...

  • @kennethvega7332
    @kennethvega7332 3 года назад +2

    Thank you, I hope you make beautiful website designs in the future 🙂👍

  • @UnknownUser-xe9bc
    @UnknownUser-xe9bc 3 года назад +2

    Thanks sir your html CSS JavaScript playlist is very helpful for me !❤️
    Thanku soooooooo much 😍😍😍
    Amazing explanation 😺👍
    I saw many tutorials of html CSS and js but your channel is impressive!!
    Keep spreading your knowledge ☺️
    For all videos ❤️👍

    • @DevDreamer
      @DevDreamer  3 года назад +2

      Hey Ritu, thank you so much for this wonderful comment, I really appreciate your support 🙂👍

  • @yuriaugusto1084
    @yuriaugusto1084 2 года назад +1

    This is a good tutorial!!

  • @maweryoutube9852
    @maweryoutube9852 3 года назад +1

    Very very amazing and usefulllllllllllllllllllllllllllllllllllllllllllllllllll

  • @dllm3tommy741
    @dllm3tommy741 Год назад

    Thanks for the video

  • @natashanyamvwala285
    @natashanyamvwala285 3 года назад +1

    Love this

  • @eminationfuzion4924
    @eminationfuzion4924 3 года назад +4

    hey, how do you do the animations you presented at the beginning?

    • @DevDreamer
      @DevDreamer  3 года назад +5

      Hey EminationFuZioN, I'm hoping to do a future videos about these 🙂👍

  • @the_hasnat
    @the_hasnat Год назад

    Good job

  • @elmiabir7059
    @elmiabir7059 Год назад

    Why does weird thing happen when I type
    body{ background-image: linear-gradient(red, blue);} ?

  • @qb3014
    @qb3014 2 года назад

    hey i have a problem, it shows a yellow error with this messages:
    "Also define the standard property 'background-clip' for compatibility" css(vendorprefix)
    this is my code:
    h1{
    position: center;
    font-size: 60px;
    top: 35%;
    left: 20%;
    background: linear-gradient(90deg, #ff0000, #ffff00, #ff00f3, #0033ff, #ff00c4, #ff0000);
    background-size: 400%;
    font-family: sans-serif;
    letter-spacing: 5px;
    font-weight: 600;
    word-spacing: 5px;
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;

  • @ajiteshmishra
    @ajiteshmishra 3 года назад +1

    new subscriber

  • @kkeoppi
    @kkeoppi Год назад

    how can i put a text inside the linear gradient? i cant put any text in my linear gradient what should i do?

  • @_gauravkumar
    @_gauravkumar 3 года назад

    why is not gradient smooth in vertical and horizontal direction but in other directions??

  • @stomperhk9107
    @stomperhk9107 3 года назад

    No matter how much I watch the video and search, I really can't understand de the part (about closest-side, closest corner...).

    • @jasonchua4001
      @jasonchua4001 3 года назад +1

      same here

    • @stomperhk9107
      @stomperhk9107 3 года назад +1

      @@jasonchua4001 Yeah, I just ignored it.

    • @marvelomologbe8106
      @marvelomologbe8106 27 дней назад

      You didn't understand it because he added ''at position" property, do not add position property if you want to see the difference clearly. Farthest-side makes the gradient bigger in size, it expands the size of the circle farther to the the edgees of the container, while closest-side makes the circle smaller, it draws the circle close to the center of the center. Farthest-corner expands the circle closer to the 4 edges of the container, this makes the circle even larger than farther-side property, and the closest-corner makes the circle bigger than closest-side

    • @marvelomologbe8106
      @marvelomologbe8106 27 дней назад

      ​@@stomperhk9107but it's good to know these things, I hate to leave any stone unturned, because there's a reason that property was created in the first place, you might run into a problem later in the future where that property would have easily rescued you😊

  • @abteyeb7969
    @abteyeb7969 2 года назад +1

    it is good

    • @DevDreamer
      @DevDreamer  2 года назад

      Thanks for watching! Any other tutorial you’d like to see? 🙂👍

    • @chimdindunwosu8087
      @chimdindunwosu8087 2 года назад

      @@DevDreamer bootstrap

  • @wyyim1017
    @wyyim1017 3 дня назад

    How do I do a linear gradient for the whole page

    • @DevDreamer
      @DevDreamer  3 дня назад

      Hey, you can maybe add the css for the linear gradient to the tag itself, thanks for watching 🙂👍

  • @CampusLifeShow-zt1kc
    @CampusLifeShow-zt1kc 6 месяцев назад +1

    10q bro

  • @calipso278
    @calipso278 2 года назад

    How to do top and bottom sir

  • @Mahdi_420Op
    @Mahdi_420Op Год назад

    Software name?

  • @backspaced97
    @backspaced97 Год назад

    at the start i thoughjt i had 2x speed on

    • @DevDreamer
      @DevDreamer  Год назад

      Haha apologies! I do talk quite fast, hope you enjoyed the content 👍

  • @SalamiRidwan-abolaji
    @SalamiRidwan-abolaji Месяц назад

    very nice lesson