Сайтка блокту кантип кошсо болот

Мазмуну:

Сайтка блокту кантип кошсо болот
Сайтка блокту кантип кошсо болот

Video: Сайтка блокту кантип кошсо болот

Video: Сайтка блокту кантип кошсо болот
Video: ЛЮБОЙ СМАРТФОНДУН ПАРОЛУН АЧСА БОЛОТ/ aSaNoV mobile 2024, Декабрь
Anonim

Сайт макетинин эки түрү бар: таблицалык жана блоктук. Ал эми биринчиси жөнөкөй html баракчаларын түзүүгө ыңгайлуу болсо, экинчиси блок элементтеринин айрым элементтерин кошуу керек болсо, идеалдуу.

Сайтка блокту кантип кошсо болот
Сайтка блокту кантип кошсо болот

Нускамалар

1 кадам

Блоктун дизайнын өз алдынча иштеп чыгууга мүмкүндүк берген эки ыкма бар: каскаддык стилдерди документтин ичине киргизүү же аларды тышкы ресурстардан туташтыруу. Экөө тең бирдей натыйжа берет, ошондуктан алардын ортосунда принципиалдуу айырмачылык жок. Биринчи учурда, төмөнкү кодду style.css файлынын каалаган жерине чаптаңыз:

.block1 {

}

Block1 - блоктун аталышы, каалаганын жаза аласыз. Тармал кашаанын ортосунда төмөнкү форматтагы параметрлерди көрсөтүңүз: атрибуттун аты> кош чекит> маани> үтүрлүү үтүр (анын ичинде тармал кашаанын алдына коюлган). Көбүнчө төмөнкү элементтер колдонулат:

- туурасы - туурасы (500px, 100% ж.б.);

- бою - бою (200px, 25% ж.б.);

- фон - фондук түс (Сары, Кызыл, # 000000);

- толтуруу - блоктун ичиндеги мазмунун тегеретип толтуруу (0px, 20%);

- маржа - блоктун тышкы чектери (15px, 40%);

- чек ара - алкак (чек: катуу 0px кара;);

- калкып өтүү - тегиздөө (солго, оңго);

- border-radius - бурчтарды тегеректөө (border-radius: 10px;).

2-кадам

CSSди экинчи жолу колдонууда жана тегдердин ортосуна стиль кошуңуз:

.block1 {

}

Жана сиз каалаган параметрлерди кошуңуз.

3-кадам

Блокту сайттын каалаган жерине төмөнкү буйрукту колдонуп киргизиңиз:

Блок 1

Баракчаны сактап, жаңылаңыз, ал пайда болушу керек. Бийиктикти тегиздөө мазмундун толуктугуна жараша өзгөрүлүшү мүмкүн экендигин унутпаңыз. Мисалы, сиз 300px орнотуп, бирок бир гана сап текстин жазсаңыз, ал толугу менен көрсөтүлбөйт. Муну, мисалы, блоктун ичине жайгаштырылышы керек болгон керектүү параметрлери бар таблицаны колдонуп, оңдоого болот, б.а. тегдердин ортосунда жана. Чектери көрүнбөй тургандай кылып, атрибутун киргизиңиз

Сунушталууда: