Използвайте CSS код, за да подравните списъци с водещи символи в HTML.
Уеб дизайнерите използват списъци с куршуми за повече от просто добавяне на куршуми и текст. HTML маркерът, използван за създаване на списъци с водещи символи, е удобен за създаване на менюта или организиране на изображения за JavaScript за зареждане в слайдшоу. Да се научите да използвате каскаден код на стилова таблица във връзка със списъци с куршуми - наречени "неподредени списъци" на HTML жаргон - ще отвори няколко вълнуващи възможности за уеб дизайн.
Етап 1
Отворете своя HTML файл, съдържащ списъка с водещи символи, и погледнете между маркерите и в горната част на кода. Добавете тагове, ако вече не са налице. Ако вашият код включва a таг някъде след етикета и това съдържа препратка към CSS файл, след което отворете този файл вместо това. Вашият CSS код преминава между етикетите или на нов ред от вашия CSS файл.
Видео на деня
Стъпка 2
Подравнете текста във всички водещи символи, като зададете "text-align" за вашия
- етикет. В
- и тагове, за да ги дефинирате като част от един списък. Когато подравнявате текст за
- етикетът се обвива около
- tag, подравняването засяга текста във всеки водещ символ, но не подравнява самия списък вляво или вдясно на страницата. Ето пример за CSS код за задаване на "text-align":
ul {text-align: right;}
Имайте предвид, че куршумите не се движат с текста. В този случай куршумите остават отляво.
Стъпка 3
Подравнете целия списък отляво или отдясно на страницата, като зададете "float" за вашия
- етикет. Когато "float" е настроен наляво или надясно на a
- маркер, той премества целия списък с водещи символи вляво или вдясно на страницата. Задайте float така:
ul {float: вдясно;}
Можете да зададете "float" отляво или отдясно, но не и до центъра.
Стъпка 4
Увийте си
- тагове в
и
тагове, за да създадете обвивка, която ще центрира списъка с водещи символи на вашата страница. Полученият ви код ще изглежда така:- Елемент от списъка
- Елемент от списъка
В
маркерът не центрира нищо сам по себе си; трябва да използвате CSS, за да центрирате всичко. Добавете следния код между вашите