Loading...
daniel.nikov926 avatar daniel.nikov926 18 Точки

Problem 2 - Основи на CSS

Здравейте, опитах се да сложа image, вместо точките на ul > li, но взех външна картинка от google.com и не знам как да я намаля, моля помогнете ми.

кода ми е :

li {
    padding-bottom: 10px;
    text-align: left;
    text-indent: 30px;
    width: 180px;
}
ul {
    list-style-image: url('http://www.clipartbest.com/cliparts/di8/7LM/di87LM8ie.png');
}

Тагове:
0
Web Fundamentals - HTML5
Philip.Paskalev avatar Philip.Paskalev 24 Точки

Твърде голяма резулюция са картинките, които използваш за list-style-image.

Етопробвай с тези и ще стане

li {
    padding-bottom 10px;     
    text-align left;     
    text-indent 30px;     
    width 180px;
}
ul {
    list-style-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAnFBMVEX///8ltB6h4pKR3ISC1nmy6Z/B8Kz8/Pz19fXQ9bcksB3v7+/5+fnn5+f29vbf398ipxxbx1Pb+r82pzGhq6DZ2dlPw0UpqCN8q3llqmLN0chHq0Jyq3DF3qnG0rmUspOnw6OqqqqSuo7Kysq+7p28vLyZqpizs7OZy4mG1npy0GPT+bLB4qO47Zas5pKj44e2xrVEvztoy2GWupXSDINXAAAA80lEQVQ4jeWS23bCIBBFtTcIAwxUiYoajTT1Emu9/P+/NVnpWtJJ8uxD9+vZDGfBDAb/D8YVIirOenKN2TJJkmWGuvM4+GP5XlMePXQMgeyrTH75yKA933+/3Tn51i1qd3qN2CnawB+eYvaetNDrw3PMfk3u4Bv78ocNJ8JNDC9pau31am2aXsSNCPIshjHiLElJN48NMXekJFMrczeEWdG3ZBAWRjSKEGYR6I8xjsV0UikVZjItlG4JyhXj2cgYM5qNCwRJBVkZYZvnn3m+DQjtnagNhc4F51ABpwMaA0BVQB13LhWTUnPOdU/cODW96aP4AUToEowFSywUAAAAAElFTkSuQmCC');
}

Другия вариянт е да сложиш в html документа img таг в li таговете и после в css файла да сложиш source към url-ла и зададеш размери:

HTML

<ul>
  <li><img/>1</li>
  <li><img/>2</li>
  <li><img/>3</li>
  <li><img/>4</li>
</ul>

CSS

li {
    padding-bottom: 10px;
    text-align: left;
    text-indent: 30px;
    width: 180px;
}
img {
  content:url(http://www.clipartbest.com/cliparts/di8/7LM/di87LM8ie.png);
  width: 15px;
  height: 100%;
}

Или оразмеряваш файла, който ще използваш, качваш го някъде и използваш.

Поне аз за това се сещам сега.

0
06/09/2016 11:13:24
daniel.nikov926 avatar daniel.nikov926 18 Точки

успях да го направя, сега ми остана да центрирам текста по средата на li елемента

0
daniel.nikov926 avatar daniel.nikov926 18 Точки

aside nav header{
    text-decoration: underline;
    font-size: 35px;
}
ul {
    list-style: none;
}
li {
    text-align: left;
    text-indent: 10px;
    margin-top: 20px;
    margin-left: -50px;
}
ul li a{
    font-size: 25px;
    padding-left: 30px;
    padding-top: 20px;
    text-decoration: none;
    background-repeat: no-repeat;
    background-image: url('http://findicons.com/files/icons/1609/ose_png/256/tick.png');
    background-position: 0 25px;
    background-size: 20px 20px;
    position: relative;
    color: black;
}

0
Philip.Paskalev avatar Philip.Paskalev 24 Точки

Даваш text-align: center;

0
daniel.nikov926 avatar daniel.nikov926 18 Точки

Това съм го пробвам, не работи и ако погледнеш това което съм написал, ще разбереш, защо .

0
Можем ли да използваме бисквитки?
Ние използваме бисквитки и подобни технологии, за да предоставим нашите услуги. Можете да се съгласите с всички или част от тях.
Назад
Функционални
Използваме бисквитки и подобни технологии, за да предоставим нашите услуги. Използваме „сесийни“ бисквитки, за да Ви идентифицираме временно. Те се пазят само по време на активната употреба на услугите ни. След излизане от приложението, затваряне на браузъра или мобилното устройство, данните се трият. Използваме бисквитки, за да предоставим опцията „Запомни Ме“, която Ви позволява да използвате нашите услуги без да предоставяте потребителско име и парола. Допълнително е възможно да използваме бисквитки за да съхраняваме различни малки настройки, като избор на езика, позиции на менюта и персонализирано съдържание. Използваме бисквитки и за измерване на маркетинговите ни усилия.
Рекламни
Използваме бисквитки, за да измерваме маркетинг ефективността ни, броене на посещения, както и за проследяването дали дадено електронно писмо е било отворено.