Bootstrap grid in Telugu | Bootstrap grid layout | Bootstrap tutorials |Bootstrap grid system

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

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

  • @codecreator7503
    @codecreator7503 Год назад +3

    1) 00:00:21 how bootstrap will work explain here.
    2) 00:00:30 for create grid layout which class we are used explain here.
    3) 00:00:50 why we use grid layout explain here.
    4) 00:00:57 responsive layout meaning explain here.
    5) 00:01:22 non responsive website.
    6) 00:02:36 sample html pahe.
    7) 00:03:20 how the bootstap will work in grid system. (bootstap each row divided into 12columns.
    8) 00:04:00 meaning of the column.
    9) 00:04:20 how we can divided the column in the row.
    10) 00:04:48 difference between col and col-. (eg:if we take col-6 meaning of this we are merging six parts in to single column (each column consist 6 merged parts) ani meaning.
    11) 00:07:35 note point what happen if we insert more than 12 columns in a single row.
    12) 00:08:15 (if we want 3 columns as output how many parts we want to merge.
    13) 00:09:25 explain about bootstap how to use in our code.
    15) 00:11:100 difference between col and col- .
    16) 00:15:40 if we clearly obserbe here single row only increare because 12 parts completed then only it will break into new line
    17) 00:18:05 bootstap classfor margin. (how we know for whcih propery which class we want ot use)
    18) 00:22:20 note point for the column parts merge share.
    19) 00:24:30 breakpoints (how many columns want to display according to the based on hte deveice width)
    20) 00:25:50 bootstap provide classes based on the width of difference devices
    21)00:26:30 for single element we can give multibale classes
    22) 00:28:10 implement of the html structure with different classes to a single element.
    23) 00:3047 explain why it occupy that much place only.
    24) 00:35:40 large devide.
    25) 00:36:03 medium device.
    26) 00:36:22 small device.
    27) 00:36:35 extra small device.
    28)
    ------------------
    note:when the width will decrease the content break and come into new line.
    when the width width will increase the conent will come beside eachother.
    3)here row class will work as a parent it is not a row. we are confused in this point.
    4)(how we know for whcih propery which class we want ot use)
    5) (which is written on the sharp side is min) < (which iswrite on the open side is the max value)
    --------------------
    1) min-width:0px and max-width:576px (extra small ) col
    2) min-width:576px to max-width:768px( small )--sm
    3) min-width: 768px to max-width:992px (medium)--md
    4) min-width: 992px to max-width:1200px (large)--lg
    5)min-width: 1200px (extra large) here max width is not define --xl

  • @guntreddidhanunjayanaidu5121
    @guntreddidhanunjayanaidu5121 Год назад +3

    మీరు ఏదైనా చాలా చక్కగా లోతుగా చెప్ప గలరు.

  • @siddarthreddykoppera5930
    @siddarthreddykoppera5930 6 месяцев назад +3

    Wonderful explanation

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

    Thank you mam. Good guidence

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

    Tq medam.

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

    Nuv super 😘😘😘 nuvv normal ga class lu ofline lo tisukuntavaaa

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

    react start cheyachu ga mam, react with bootstrap use avuthayi only html, css, bootstrap kante react lo chepthe useful ga untundhi

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

    How to align without space between columns in vertical alignment

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

      Flex direction :row
      Align content : middle or center

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

    Mam class lo ఏ name అయిన పెట్టుకోవచ్చా లేకపోతే ఏమైనా కచ్చితమైన names ఉన్నాయా...?

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

      Anything is fine ,but use meaning full name

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

    @media gurinchi inkaa detail ga cheppandi plj...

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

      Watch this.
      ruclips.net/video/_uFiLcNryB0/видео.html

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

    Akka -container lo kadha row class div theeskovalsindhi... Nuvventi row class div ke -container class add chesav... Andhukenemo sides gap chuuinchatla normal ga bootstrap lo left and right side space untundhga content ki... Please check this once..??

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

      I mean.. Container yemo row elements ni hold chesthundhi.. Eee row nemo columns ni hold chesthundhiga... So i think container lo row lo mana column classes use cheyyalemo... 🤔🤔🤔

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

      Ok Thank you I will check

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

    .col-lg-, .col-sm-, .col-md-, .col-xl-, .col-xxl-
    => we need to mention the above prefix in every document for responsive result or "Bootstrap" link is enough to auto-responsive the page without mentioning above one.
    Can you explain?

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

      Bootstrap link is must,It has styles defined for col-lg .col-sm...

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

      @@csworldtelugu Thanks👍👍

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

    Time stamps of bootstrap