CSS-селекторлық, және HTML-құжатты пішімдеу оның рөлі

веб-сайт жасау және веб-бет жекелеген элементтерімен оны толтыру, әркім осындай CSS-селектор ретінде терминді тап болады. Бұл дәлірек бетінде олардың дизайны мен орналасқан HTML-файл барлық элементтерін анықтау үшін қызмет етеді. түсі, мөлшері, орналасқан жері және басқа да: Бұл әрекетті орындау үшін, белгілі бір селекторы және олардың пішімдеу параметрлерін жүзеге заклинания CSS-құжат жасаңыз. Әрбір веб-дизайнер біледі және дұрыс қалаған таңдаулар енгізу мүмкіндігі болуы тиіс. Олар түріне, біз төменде талқылау оның негізгі бөлінген.

CSS бойынша селекторов түрлері

HTML пішіміндегі элементі қолданылатын байланысты, CSS-селекторлық мына топтардың біріне байланысты болуы мүмкін:

• Тег селекторлық;
• класс селекторлық;
• ID-селекторлық;
• Атрибут селекторлық.

Tag селекторлық

Ол сондай-ақ, ол ең қарапайым және жалпы болып табылады, «түрі селекторлық» немесе «элемент» деп аталады. Оның CSS-құжат ретінде біз сипаттау HTML-файл элементтерін атаулары болып табылады. біз еже мәнерін орнату қажет болса, мысалы, біз элементі б {фондық сипаттарын және олардың мәндерін көрсетіңіз: х; түсі: у; мөлшері: Z}. Бұл жағдайда, веб-беттің барлық тармақтары бірдей пішімді болады (фондық түсі, мәтін мөлшері және т.б.. D.).

класс селекторлық

Сізге және сіздің әрбір тармақты сұрағым керек, егер басқа стильдерден айырмашылығы қандай? Бұл әрекетті орындау үшін, сынып селекторлық бар.

p.first {түсі: бұл жағдайда CSS-құжат мынадай нысандағы жазбаны қамтитын еді х; қаріп мөлшері: у}. Осылайша, біз тек бірінші сынып тармағының «түсті» қасиеттері мен «өлшемін» анықтау.

Бұл жағдайда HTML-құжатта алғаш стиль атына класс төлсипаты кірді. Сыныптар Сіз веб-бет элементтері үшін қолданғыңыз келетін стиль сияқты көп болуы мүмкін.

селектор ID

Жиі беттің кез келген бір элемент, мысалы, дәлірек стилі анықтауға немесе оларды пробовать қажеттілігі бар. Бұл жағдайда, көмек ID-ауыстырғышты келеді. HTML файлы басқалардың арасында, оны анықтайтын қажетті элемент атын тағайындаңыз. Мысалы, біз басқа стиль ерекшеленеді орнатқыңыз элементтері мақала атауы болады.

Содан кейін HTML-құжатта тақырып H1 идентификаторы, мұндай articlename тағайындау. Ал CSS-файлда, ID атауы тормен қосу, стиль көрсетіңіз: #articlename {түсі: көк; мәтін-Align: орталығы}. Енді біздің газеті көк және ортасында түс болады.

Жоғарыда түрлері Әрбір «қарапайым CSS-селектор» ретінде сипаттауға болады. Олар HTML-құжаттың нақты параметр үшін пішімдеуін белгілеу: бірге ұқсас элементтер (мысалы, мақала барлық тармақтарды), (мысалы, тек бірінші тармақты) бір класс немесе (мысалы, мақала тақырыбын) белгілі бір элементті.

атрибут селекторы

Жоғарыда Сонымен қатар, CSS-селекционер-бар атрибуттары - өтініш стильдердің көп күрделі әдісі. Ол таңдалған немесе төлсипат құны туралы HTML пішімі элементтері мүмкіндік береді. Осы селектор бірнеше сорттары бар:

• төлсипаты болуымен;
• оның дәл құнмен;
• ішінара атрибут құнына;
• оның нақты құны бойынша.

АҚШ-тың осы түрлердің әрқайсысы қарастырайық:

1. Бірінші жағдайда. нақты атрибуты HTML-код бар болса Пішімдеу (ол р, DIV, тақырып, және т.б. болуы мүмкін), қолданылады. олай емес болса, онда ол стиль барлық элементтер үшін жалпы пайдаланады. Мысалы, атағы бар элементтер үшін (құралы ұшы).
2. Екінші жағдайда. стиль ғана төлсипат мәндерінің дәл сәйкестік бар HTML-элементтер қолданылады. Мысалы, түрі төлсипатының мәні ұсынуға тең элементтері, кіріске.
3. Үшінші жағдайда. форматқа сәйкес тек белгілі бір сөз бар құндылықтарды тізімдегі элементтерді қамтиды. Мысалы элементтері бөлгішінде үшін, Sidebar төлсипаты «класс».
4. Төртінші жағдайда. Стиль ғана, атап айтқанда, атрибут белгілі бір мәні бар, және онымен бірге басталады HTML-құжаттың осы элементтерге арналған анықталады. Мысалы ағылшын тілі атрибут барлық элементтері көрсетілген түсті, пайдалану (EN, EN-RUS, EN-ау мен т болуы мүмкін. Д.).

Осылайша, бір немесе басқа да, CSS пайдаланып, селектор, үздік бүкіл веб-бет ретінде көрсетілген, және оның кейбір элементтерін сипаттау мүмкін.