Sodda CSS xususiyatlari

Fontni (shriftni) belgilash

font-family: Arial;

Bu Arial

font-family: Segoe UI;

Bu Segoe UI

font-family: Tahoma;

Bu Tahoma

font-family: monospace;

Bu monospace

font-family: Comic Sans MS;

Bu Comic Sans MS

Harflarning yo'g'onligi

font-weight: 900; /* eng yo'g'on */

yo'g'onlik 900

font-weight: 400; /* oddiy */

yo'g'onlik 400

font-weight: 300; /* ingichka */

yo'g'onlik 300

Harflarning o'lchami (kattaligi)

font-size: 50px; /* harflarning kattaligi - 32 piksel*/

O'lcham 50px

Harflarning rangi

color: red; /* harflarning rangi qizil */
color: #ff0000; /* harflarning rangi qizil */

qizil rang

color: blue;

ko'r rang

color: pink;

pushti rang

color: rgb(255, 0, 0);

qizil rang

color: rgb(0, 255, 0);

yashil rang

color: rgb(0, 0, 255);

ko'k rang

color: rgb(0, 0, 0);

qora rang

color: rgb(255, 255, 255);

oq rang

color: #ffffff; /* oq rang */
color: #fff; /* oq rang */
color: #000000; /* qora rang */
color: #000; /* qora rang */
color: #ff0000; /* qizil rang */
color: #f00; /* qizil rang */
color: #00ff00; /* yashil rang */
color: #0000ff; /* ko'k rang */
/* yarim-shaffof qora rang - orqadagi rang va */
/* boshqa narsalar ko'rinib turadi */
color: rgba(0, 0, 0, 0.5); 

yarim-shaffof qora rang - orqadagi rang va boshqa narsalar ko'rinib turadi

/* yarim-shaffof qora rang - orqadagi rang va */
/* boshqa narsalar ko'rinib turadi */
color: #00000080; 

yarim-shaffof qora rang - orqadagi rang va boshqa narsalar ko'rinib turadi

Orqa rangi

background-color: red; /* orqa rangi qizil */
background-color: rbg(255, 0, 0); /* orqa rangi qizil */
background-color: #ff0000; /* orqa rangi qizil */

qizil rang

Harflar orasida masofa

letter-spacing: 5px; /* harflar orasida masofa 1px */

Harflar orasida 5 piksel

letter-spacing: 1em; /* harflar orasida masofa font-size ga teng */

Harflar orasida bir font-size

Satrning balandligi

line-height: 22px; /* satrning balandligi 22px */
line-height: 1; /* satrning balandligi font-size ga teng */
line-height: 2; /* satrning balandligi ikkita font-size ga teng */
line-height: 1.4; /* satrning balandligi font-size * 1.4 teng */

Satrning balandligi 40px Satrning balandligi 40px Satrning balandligi 40px Satrning balandligi 40px Satrning balandligi 40px Satrning balandligi 40px Satrning balandligi 40px Satrning balandligi 40px Satrning balandligi 40px

Matnning bezagi

text-decoration: underline; /* matnning tagida chiziq */

Assalomu alaykum

text-decoration: overline; /* matnning tepasida chiziq */

Assalomu alaykum

text-decoration: line-through; /* matnning o'rtasida chiziq */

Assalomu alaykum

text-decoration: none; /* bezak yo'q */

Assalomu alaykum

Matnning soyasi

text-shadow: 3px 1px 4px #ff0000; /* qizil rangli matnning soyasi */ 

Assalomu alaykum

Chegara

border: 3px solid red; /* yaxlit qizil 3 pikselli chegara */

yaxlit qizil 3 pikselli chegara

border: 2px dotted brown; /* chiziqchali jigarrang 15 pikselli chegara */

chiziqchali jigarrang 15 pikselli chegara

Ichki masofa (padding)

/* qizil chegara, va ichida 15 pikselli masofa */
border: 1px solid red; padding: 15px;

qizil chegara, va ichida 15 pikselli masofa

/* qizil chegara, va ichida tepada 15 pikselli masofa */
border: 1px solid red; padding-top: 15px;

qizil chegara, va ichida tepada 15 pikselli masofa

/* qizil chegara, va ichida pastda 15 pikselli masofa */
border: 1px solid red; padding-bottom: 15px;

qizil chegara, va ichida pastda 15 pikselli masofa

/* qizil chegara, va ichida chapda 15 pikselli masofa */
border: 1px solid red; padding-left: 15px;

qizil chegara, va ichida chapda 15 pikselli masofa

/* qizil chegara, va ichida o'nda 15 pikselli masofa */
border: 1px solid red; padding-right: 15px;

qizil chegara, va ichida o'nda 15 pikselli masofa

/* qizil chegara, va ichida tepada 15px */
/* masofa va chapda 20px masofa */
border: 1px solid red; padding-top: 15px; padding-left: 20px;

qizil chegara, va ichida tepada 15px masofa va chapda 20px masofa

/* qizil chegara, va ichida tepada-pastda */
/* 5px o'nda-chapda 30px masofa */
border: 1px solid red; padding: 5px 30px;

qizil chegara, va ichida tepada-pastda 5px o'nda-chapda 30px masofa

/* qizil chegara, va ichida tepada 5px */
/* o'nda-chapda 30px pastda 10px masofa */
border: 1px solid red; padding: 5px 30px 10px;

qizil chegara, va ichida tepada 5px o'nda-chapda 30px pastda 10px masofa

/* qizil chegara, va ichida tepada 5px o'nda 30px */
/* pastda 10px chapda 2px masofa */
border: 1px solid red; padding: 5px 30px 10px 2px;

qizil chegara, va ichida tepada 5px o'nda 30px pastda 10px chapda 2px masofa

Tashqi masofa (margin)

/* qizil chegara va tashqi masofa 30px */
border: 1px solid red; margin: 30px;

qizil chegara va tashqi masofa 30px

/* qizil chegara va tashqarisida tepada masofa 100px */
border: 1px solid red; margin-top: 100px;

qizil chegara va tashqarisida tepada masofa 30px

/* qizil chegara va tashqarisida pastda masofa 100px */
border: 1px solid red; margin-bottom: 100px;

/* qizil chegara va tashqarisida chapda masofa 100px */
border: 1px solid red; margin-left: 100px;

/* qizil chegara va tashqarisida o'nda masofa 100px */
border: 1px solid red; margin-right: 100px;

/* qizil chegara va tashqarisida tepada-pastda */
/* 100px o'nda-chapda 50px masofa */
border: 1px solid red; margin: 100px 50px;

/* qizil chegara va tashqarisida tepada 100px */
/* o'nda-chapda 50px pastda 30px masofa */
border: 1px solid red; margin: 100px 50px 30px;

/* qizil chegara va tashqarisida tepada 100px */
/* o'nda 50px pastda 30px chapda 35px masofa */
border: 1px solid red; margin: 100px 50px 30px 35px;

Yumaloqlik

/* 6 pikselli yumaloq chegara */
border: 1px solid red; border-radius: 6px;

6 pikselli yumaloq chegara

/* 9999 pikselli yumaloq chegara */
border: 1px solid red; border-radius: 9999px;

9999 pikselli yumaloq chegara

/* 50 foizli yumaloq chegara */
border: 1px solid red; border-radius: 50%;

50 foizli yumaloq chegara

Soya

/* o'nga 3px pastga 2px loyqalash masofasi 4px */
/* tarqalish masofasi 1px rangi kulrang */
box-shadow: 3px 2px 4px 1px gray;

o'nga 3px pastga 2px 4px loyqalash masofasi 4px tarqalish masofasi 1px rangi kulrang

/* ichki soya, o'nga 3px pastga 2px loyqalash masofasi 4px */
/* tarqalish masofasi 1px rangi kulrang */
box-shadow: inset 3px 2px 4px 1px gray;

o'nga 3px pastga 2px 4px loyqalash masofasi 4px tarqalish masofasi 1px rangi kulrang

/* ikkita soya*/
box-shadow: 3px 2px 4px 1px gray, -1px -1px 4px 1px pink;

ikkita soya

Tashqi chiziq

outline: 1px solid red;

1 pikselli ko'k outline

outline: 5px dashed black;

5 pikselli qora outline

outline: 5px dotted pink;

5 pikselli pushti outline

outline: 5px solid black;

5 pikselli qora outline

Tashqi chiziq bilan chegara orasida farq

  1. Tashqi chiziqqa border-radius ta'sir etmaydi
  2. Tashqi chiziq boshqa unsurlarning ustiga ham turib qoladi

Misol:

Tashqi chiziq boshqa unsurlarning ustiga ham turib qoladi

Orqa rasmi

background-image: url(http://placekitten.com/200/138);

Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi

/* Boshqa misollar */
background-image: url(rasm-nomi.jpg);
background-image: url(rasm-nomi.png);
background-image: url(rasm/manzili.png);
background-image: url(./rasm/manzili.png);
background-image: url(../rasm/manzili.png);
background-image: url(../../rasm/manzili.png);

Orqa ranginig tadrijiy o'zgarishi

/* orqa rangi qizildan havorangga o'zgaradi*/
background-image: linear-gradient(red, skyblue);

Assalomu alaykum

/* orqa rangi o'ndan chapga qizildan havorangga o'zgaradi*/
background-image: linear-gradient(to left, red, skyblue);

Assalomu alaykum

/* orqa rangi o'ndan chapga qizildan */
/* havorangga binafsharannga ko'kka o'zgaradi*/
background-image: linear-gradient(to left, red, skyblue, violet, blue);

Assalomu alaykum

/* orqa rangi markazdan chetga qizildan */
/* havorangga binafsharannga ko'kka o'zgaradi */
background-image: radial-gradient(red, skyblue, violet, blue);

Assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum

/* orqa rangi markazdan chetga yarim-shaffof havorangdan yarim-shaffof binafsharangga o'zgaradi */
background-image: radial-gradient(rgba(238, 130, 238, 0.8), rgba(135, 206, 235, 0.8));

Assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum

/* birinchi orqa rasmi - orqa rangi markazdan chetga yarim-shaffof */
/* havorangdan yarim-shaffof binafsharangga o'zgaradi */
/* ikkinchi orqa rasmi - mushuk */
background-image: radial-gradient(
        rgba(238, 130, 238, 0.8),
        rgba(135, 206, 235, 0.8)
    ),
    url(http://placekitten.com/200/138);

Assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum assalomu alaykum

Orqa rasm qaytarilishi (background-repeat)

background-repeat: no-repeat;background-image: url(http://placekitten.com/200/138);
border: 1px solid red;

Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi

background-repeat: repeat;background-image: url(http://placekitten.com/200/138);
border: 1px solid red;

Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi

background-repeat: repeat-x;background-image: url(http://placekitten.com/200/138);
border: 1px solid red;

Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi

background-repeat: repeat-y;background-image: url(http://placekitten.com/200/138);
border: 1px solid red;

Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi

Orqa rasmining joylashuvi (background-position)

background-position: 100px 30px;background-repeat: no-repeat;
background-image: url(http://placekitten.com/200/138);
border: 1px solid red;

Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi

background-position: 20px 110px;background-repeat: no-repeat;
background-image: url(http://placekitten.com/200/138);
border: 1px solid red;

Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi

background-position: 33% 5%;background-repeat: no-repeat;
background-image: url(http://placekitten.com/200/138);
border: 1px solid red;

Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi

background-position: center;background-repeat: no-repeat;
background-image: url(http://placekitten.com/200/138);
border: 1px solid red;

Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi

Orqa rasmining o'lchami (background-size)

/* rasmning o'lchami yotiq o'q bo'yicha 100px */
background-size: 100px;background-repeat: no-repeat;
background-image: url(http://placekitten.com/200/138);
border: 1px solid red;

Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi

/* rasmning o'lchami yotiq o'q bo'yicha 100px */
/* va tik o'q bo'yicha 200px */
background-size: 100px 200px;background-repeat: no-repeat;
background-image: url(http://placekitten.com/200/138);
border: 1px solid red;

Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi

/* 50% yotiq o'q bo'yicha cho'ziladi, */
/* tik o'q bo'yicha olchamini brauzer o'zi belgilaydi */
background-size: 50%;background-repeat: no-repeat;
background-image: url(http://placekitten.com/200/138);
border: 1px solid red;

Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi

/* 20% yotiq o'q boyicha va 100% tik o'q bo'yicha cho'ziladi */
background-size: 20% 100%;background-repeat: no-repeat;
background-image: url(http://placekitten.com/200/138);
border: 1px solid red;

Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi

/* rasmni eng katta darajagacha kattalashtirish */
background-size: contain;background-repeat: no-repeat;
background-image: url(http://placekitten.com/200/138);
border: 1px solid red;

Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi Mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi mushukning rasmi