Css va Css freymvorklar

Css va Css freymvorklar (54)

Aly_Ilamanow
#41 14:38:57, 26 Feb 2020

Azamchik, Link orqali ulasam ham ishlamadi.

Aly_Ilamanow
#42 14:42:35, 26 Feb 2020

Rusich, 4.4.1 bazi codlari yaxshi ekanda

iamwedeuz
#43 15:19:53, 26 Feb 2020

Aly_Ilamanow, # Aly_Ilamanow (26.02.2020 / 14:42)
Rusich, 4.4.1 bazi codlari yaxshi ekanda4.4.1 ga moslab yozing o'sha kodizni

man bootstrap ishlatmiman shunga yordam beromiman

Аьзамхон Иномов
#44 16:09:59, 26 Feb 2020

Aly_Ilamanow, Ha man uyga bore kompyuterda tekshirib koraman

gi8ri7
#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) (292 ↴)

Besthakker
#46 19:46:37, 27 Mar 2020

img {
         border-radius: 50%;
      }

Rasmni dumoloq shaklga olip keladi

Biriktirilgan fayllar [1]:
screenshot_20200327-194931.jpg (357.97 KB) (139 ↴)

developer
#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
#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) (160 ↴)

Besthakker
#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
#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
#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>

Kamron
#52 02:30:23, 25 May 2020

Ssilkani bosganda usha ssilka ozro siljiydigan kod kerak

Tayota
#53 15:18:13, 16 Jun 2020

@media dan foydalanib adaptiv dizayn qilyapgan edim. Ammo javada (opera, ucbrowser) keraksiz classlar chiqib ketyapti. Javalar uchun display: none; qilgandim. Ammo...

Sayt: http://tayota.xvest.ru
css: http://tayota.xvest.ru/dizayn/style.css

qayerda xato qilganman?

gi8ri7
#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) (131 ↴)