Компютри » Разделяне от върха на CSS: позициониране на съдържанието

Разделяне от върха на CSS: позициониране на съдържанието

Компютри

CSS Nesting е винаги правоъгълна. Всички плаващи линии са от компетентността на предприемача. Правилата за стила предоставят достатъчно вариации, за да придадат на страниците гладки форми в разделителната способност на екрана. Но всеки елемент на оформлението винаги е правоъгълник, в който оформлението на информацията се управлява от правилата на CSS.

Отклоненията от всички страни са важни за всеки елемент на страницата, когато е напълно позициониран, а CSS отстъпът от горната част се дефинира по-специално, защото има значение за различни елементи, особено за малки.


Основни правила за позициониране

Блок-елементът има правило за отстъпление от страните на марж-елемента, правило за вдлъбнатини за елементите в него (подложка) и ширината на границата, които също могат да бъдат използвани. От особено значение е отстъплението отгоре. CSS вътре в блока свързва правилата за отстъпване на правилата към абсолютно и относително позиционирани елементи в този блок.
Обичайно CSS правило: Можете да зададете отстъп от всички страни по същия начин, двойки над /под и дясно /ляво или за всяка страна поотделно. Например,
  • марж: 10px;
  • подплата: 10px20px;
  • подложка: 10px20px30px40px.
    • В първия случай елементът се повтаря от страните на външния контейнер, в който е разположен. Във втория случай, отстъпът от горната и долната част е 10px, лявата и дясната са 20px. В третия случай размерите на отстъпите са показани от всички страни: отгоре, отдясно, отдолу и наляво. Във всички тезислучаите, CSS отстъп от най-високо ниво е 10 px.

    Правила, които променят позицията на елементите

    Ако елементът на оформлението не е напълно позициониран, той се намира в общия ред на формиране на страници.
    Ако дефинирате CSS отстъп от scCurrInfo елемента, целта ще бъде постигната и ако е на ниво li - no.
    В този пример използването на правило за допълване: 40px; изисква адекватно намаляване на правилата за ширина и височина с 80 пиксела. В противен случай размерът на блока scCurrInfo ще се изкачи извън външната страна на блока.
    Ако премахнем правилото за пълнене от описанието на scCurrInfo, но го добавим със стойност от 20px в описанието на стила на елемента от списъка, получаваме само отстъп от върха. CSS няма да използва тази стойност за други страни. Естествено, такова използване на правилото за отстъпление е свързано с всеки елемент li.

    Практика за общо форматиране на съдържание

    Някои разработчици постигат върхови постижения, като превръщат страниците в блокови елементи. Очевидно това е класическа практика - започнете с таблици и завършете собствения си образователен процес на блокове.


    Свободата, присъща на блоковото оформление, е завладяваща и въображението на разработчика не може да бъде ограничено до строги таблични правила: само редове, само клетки, се сливат само хоризонтално и вертикално. Нищо, присъщо на релационните идеи. Междувременно, в таблицата, в допълнение към очевидните недостатъци, има много качествени предимства. Когато създавате вдлъбнатини отгоре, CSS взима предвид вдлъбнатините вляво, надясно (по-долу е специален момент). Правилата на клетките на таблицата ви позволяват да контролирате изравняването както вертикално, така и хоризонтално.Използвайки стилове на редове, комбинирайки ги със стилове на клетки, можете да създавате сложни презентации на съдържание.
    Обичайното представяне на страница под формата на правоъгълници (блоково оформление) не възпрепятства представянето й като таблица. Това са и правоъгълници, но те са клетките на таблицата, т.е. имат собствени правила, които допълват правилата на блоковете.

    Абсолютно позициониране

    Блок с правило ПОЗИЦИЯ: абсолютен; ще бъде на място, определено от неговите координати по отношение на блока, в който се намира.
    Характерна особеност на правилата на CSS е "практика - най-добрият тест за истината" в повечето случаи, особено когато се изисква кръстосано сърфиране и оформлението се извършва ръчно, основно изучаването на пълно ръководство с каскадни стилови листове. Използването на таблици често води до проблема с изместването на съдържанието на клетките. Подобно пристрастие вътре в блока не винаги и не всички елементи. Експериментирайки, можете да постигнете желания резултат. Тривиалната задача: как да се премахне отстъпът отгоре, CSS не винаги се решава по тривиален начин. В някои случаи, когато трябва да обработвате елементи на страницата в дълбините на някои популярни сайтове за управление на съдържанието, трябва да обърнете внимание не само на експерименталната практика, но и да видите опита на колегите.

    Свързани публикации