Css va Css freymvorklar

3339

Yangi formatda davom etish uchun: https://uzfor.net/view.php?id=2979&page=3

Css va Css freymvorklar

Xabarlar

gi8ri7 [1900] [off]
#45 03:17:45, 3 Mar 2020

Iconkaga bosganda widget ochilayabdi va widgetni yopish uchun iconka o'zgarayabdi shunga kodlar orqali namuna ko'rsatadigonlar forumda yo'q bilaman, lekn baribir yozdim (((

Biriktirilgan fayllar [1]:
— 0d35e54b-1839-4f83-947d-52bd58b0.jpeg (587.36 KB) (107 ↴)

developer [323] [off]
#47 20:45:07, 27 Mar 2020

Besthakker, # Besthakker (27.03.2020 / 19:46)
img {
border-radius: 50%;
}

Rasmni dumoloq shaklga olip keladidumaloq mas qovun bobqoldiyu bunday qisak togriroq boladi

img{
     width: 100px;
     height: 100px;
     border-radius: 100%;
}

eni va boshi bir xil bo'lsa keyin yumaloq chiqadi

Besthakker [929] [off]
#48 20:52:33, 27 Mar 2020

developer, # developer (27.03.2020 / 20:45)
Besthakker, dumaloq mas qovun bobqoldiyu bunday qisak togriroq boladi
img{
width: 100px;
height: 100px;
border-radius: 100%;
}
eni va boshi bir xil bo'lsa keyin yumaloq chiqadiShunaqa qilsaham boladi ammo rasm maydagana bop qolayapdi

Biriktirilgan fayllar [1]:
— screenshot_20200327-205057.jpg (74.92 KB) (154 ↴)

Besthakker [929] [off]
#49 21:07:40, 27 Mar 2020

Shu kodni css ni qayeridan quyish kerak paastki qism buu

* {
         box-sizing: border-box;
      }
      html, body {
         margin: 0;
         padding: 0;
      }
      body {
         display: flex;
         min-height: 100vh;
         flex-direction: column;
      }
      main {
         flex: 1 0 auto;
      }
      footer {
         color: #fff;
         background: #333;
         position: relative; /* required to position the copyright at the bottom */
         font-size: 80%;
      }
      .footer-copyright {
         width: 100%;
         height: 40px;
         background: #111;
         /* positions the copyright at the bottom of the footer */
         padding: 10px;
         position: absolute;
         bottom: 0px;
         left: 0px;
      }
      .footer-body {
         margin-bottom: 40px;
         padding: 30px;
      }
      .footer-body > div:first-child {
         font-size: 150%;
      }
      .footer-body ul {
         list-style-type: none;
         margin: 0px;
         padding: 0px;
         text-align: center;
      }
      .footer-body li > a {
         color: white;
         text-decoration: none;
         margin-bottom: 7px;
      }
   </style>
</head>
<body>   
   <header></header>
   <main></main>
   <footer>
      <div class="footer-body">
         <div> Your Brand Here. </div>
         <div>
            <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis interdum dignissim nisl posuere efficitur. </p>
            <ul>
               <li><a href="#"> About </a></li>
               <li><a href="#"> Contact </a></li>
               <li><a href="#"> Terms & Conditions </a></li>
               <li><a href="#"> Privacy Policy </a></li>
            </ul>
         </div>
      </div>
      <div class="footer-copyright">
         © Copyright goes here. 
      </div>
   </footer>

kr_master [4] [off]
#50 13:49:55, 11 Apr 2020

Aly_Ilamanow, # Aly_Ilamanow (26.02.2020 / 11:27)
Mana shu kod bootstrap v 4.4.1 da ishlamayapti, lekin, v3.3.7 da ishlayapti. Shuni v.4.4.1 da qanday ishlatsa boladi?

<div class="btn-group">
<button type="button" class="btn btn-primary">Test

<div class="btn-group" role="group" aria-label="Button group with nested dropdown">
  <button type="button" class="btn btn-secondary">1</button>
  <button type="button" class="btn btn-secondary">2</button>
 
  <div class="btn-group" role="group">
    <button id="btnGroupDrop1" type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
      Dropdown
    </button>
    <div class="dropdown-menu" aria-labelledby="btnGroupDrop1">
      <a class="dropdown-item" href="#">Dropdown link</a>
      <a class="dropdown-item" href="#">Dropdown link</a>
    </div>
  </div>
</div>

kr_master [4] [off]
#51 13:52:24, 11 Apr 2020

Besthakker,

<!DOCTYPE html>
<html>
<head>
<style>
* {
         box-sizing: border-box;
      }
      html, body {
         margin: 0;
         padding: 0;
      }
      body {
         display: flex;
         min-height: 100vh;
         flex-direction: column;
      }
      main {
         flex: 1 0 auto;
      }
      footer {
         color: #fff;
         background: #333;
         position: relative; /* required to position the copyright at the bottom */
         font-size: 80%;
      }
      .footer-copyright {
         width: 100%;
         height: 40px;
         background: #111;
         /* positions the copyright at the bottom of the footer */
         padding: 10px;
         position: absolute;
         bottom: 0px;
         left: 0px;
      }
      .footer-body {
         margin-bottom: 40px;
         padding: 30px;
      }
      .footer-body > div:first-child {
         font-size: 150%;
      }
      .footer-body ul {
         list-style-type: none;
         margin: 0px;
         padding: 0px;
         text-align: center;
      }
      .footer-body li > a {
         color: white;
         text-decoration: none;
         margin-bottom: 7px;
      }
   </style>
</head>
<body>   
   <header></header>
   <main></main>
   <footer>
      <div class="footer-body">
         <div> Your Brand Here. </div>
         <div>
            <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis interdum dignissim nisl posuere efficitur. </p>
            <ul>
               <li><a href="#"> About </a></li>
               <li><a href="#"> Contact </a></li>
               <li><a href="#"> Terms & Conditions </a></li>
               <li><a href="#"> Privacy Policy </a></li>
            </ul>
         </div>
      </div>
      <div class="footer-copyright">
         © Copyright goes here. 
      </div>
   </footer>

gi8ri7 [1900] [off]
#54 09:28:37, 14 Jan 2022

Taak mavzuda so'ngi postga ham dearli 2 yil bo'libdi
Men sizlarni ajoyib ui css bilan tqnishtirmoqchiman:
Nomi Tailwind
Versia 2(-avlod)
Rasmiy https://tailwindui.com/
Namuna http://f0621693.xsph.ru/components/
Import http://f0621693.xsph.ru/tailwind.zip

Namuna va rasmiy saytda source kodlar va foidalanish bor
4 daqiqa 7 soniyadan keyin yozdi:
2-3 kunlarda TailwindIU asosida blog shablon tayyorlayman (Natijani baholaymiz ?)

Biriktirilgan fayllar [1]:
— tailwind.zip (5818.88 KB) (104 ↴)