Сүрөттөрдүн же тексттердин тегерегине орнотулган алкактар сайтты кооздоп, анын дизайнына ар түрдүүлүк берет. Эгерде сиз чек араларды түзүү үчүн таблицаларды колдонсоңуз, анда ар бир чек арадагы код өтө эле көп орунду ээлейт. Ошондой эле, бул учурда, ар бир кадр үчүн HTML кодун кайра жазууга туура келет. CSS менен сиз каалаган калыңдыкта жана түстө чек араны оңой эле түзүп, ушул чек ара менен курчалган бардык элементтер үчүн жөнөкөй кодду бир жолу жазсаңыз болот. Бул технология, керек болсо, бир-эки мүнөттүн ичинде сайттын алкактарынын түрүн өзгөртүүгө мүмкүнчүлүк берет.
Ал зарыл
- - өз вебсайтыңыз болсо;
- - CSS эмне экендигин жана бул стилдер сайтта кайда жазылгандыгын билүү.
Нускамалар
1 кадам
Чекит түзүү үчүн, алгач CSSке төмөнкү кодду жазыңыз:
ramka {}
2-кадам
Чек араны сиз каалаган өлчөмгө айлантуу үчүн, сызыктын туурасын пиксель менен белгилеген border-width параметрин колдонуңуз. Мисалы, алкак сызыгы 3 пикселдик кеңдикте болушу керек болсо, анда жазуу төмөнкүдөй болот:
ramka {border-width: 3px;}
3-кадам
Эми чек ара стилинин параметрин колдонуп, чек аранын стилин аныктаңыз. Эгерде сиз капталдары үзгүлтүксүз катуу сызыктардан турган чек араны түзгүңүз келсе, анда кодду төмөнкү жазууну тармал кашаанын ортосуна коюңуз - border-style: solid.
4-кадам
Чекиттүү чек араны мындай жазуу менен алса болот: чек ара стили: чекиттүү. Чек ара стилин текшерүү: үзүк чекит сизге чек ара сызыгын берет.
5-кадам
Сиз чек араны кош сызык кылып жасай аласыз: чек ара стили: кош. Чек ара стили: оюк же чек ара стили: кырка текстти же сүрөттөрдү 3D терс таасирлери менен алкактарга алкакка киргизүү үчүн. Бул эки варианттын айырмачылыгы, биринчи учурда, рамка оюк сызыктардан турат, ал эми экинчисинде, томпок сызыктардан турат.
6-кадам
Бул кодду колдонуңуз: border-style: inset сайт элементинин чек арасы менен киргизүүнүн натыйжасын түзүү үчүн. Чек аранын мазмунун, чек ара менен катар, тескерисинче, томпок кылып, чек ара стилинде: башынан жазыңыз.
7-кадам
Бөлүктүү кашаанын ортосуна жайгаштырылган border-color параметрин колдонуп, алкакка керектүү түстү кошсоңуз болот. Эгерде сиз чек араны кызыл кылгыңыз келсе, анда чек ара-түс: кызыл, көк - чек ара-түс: көк, кызгылт сары - чек-түс: кызгылт сары деп жазыңыз.
8-кадам
Бардык параметрлерди камтыган CSS чек ара коду төмөнкүдөй:
ramka {border-width: 3px; чек ара стили: бекем; border-color: blue;}
9-кадам
Эми, HTMLде, мындай деп жаз:
Фреймдин алкагы "Фрейминг мазмунунун" ордуна, керектүү сүрөттүн текстин же кодун киргизиңиз.
10-кадам
Ошентип, сиз сайтта элементтердин чексиз санын иштеп чыгууга болот. Кадрдын сырткы көрүнүшүн өзгөртүү үчүн CSS кодун гана өзгөртүү керек.
