Website Development Prices

Thursday, March 10, 2016

Kako da promenite ili uklonite znakove za nabrajanje (How to change or remove bullets)

Pitanje: kako da promenite ili uklonite znakove za nabrajanje?

Resenje: svojstvo list-style-type.

Primer:

HTML kod

<!DOCTYPE html>
<html>
<head>
<title>Kako da promenite ili uklonite znakove za nabrajanje</title>

<meta charset="UTF-8"/>
<meta name="description" content="Description that search reads" />
<meta name="keywords" content="page keywords, keywords" />
<meta name="author" content="Marija Rikic">
<link rel="icon" type="image/png" href="images/favicon.jpg">
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>


<body>

<ul class="italija">
<li>MV Agusta</li>
<li>Aprilia</li>
<li>Benelli</li>
</ul>
<ul class="spanija">
<li>Bultaco</li>
<li>Derbi</li>
<li>Gas Gas</li>
</ul>
<ul class="brazil">
<li>Agrale</li>
<li>Brasil & Movimento</li>
<li>Dafra Motos</li>
</ul>
<ul class="portugalija">
<li>AJP</li>
<li>Alianca</li>
<li>Casal</li>
</ul>
<ul class="nemacka">
<li>BMW</li>
<li>Horex</li>
<li>Maico</li>
</ul>
<ul class="argentina">
<li>Siambretta</li>
<li>Zanella</li>
</ul>
<ul class="japan">
<li>Honda</li>
<li>Kawasaki</li>
<li>Suzuki</li>
</ul>
<ul class="juzna-koreja">
<li>Daelim</li>
<li>KR Motors</li>
</ul>
<ul class="amerika">
<li>Alligator</li>
<li>Arch</li>
<li>Arlen Ness</li>
</ul>
<ul class="kanada">
<li>Big Brute</li>
</ul>
<ul class="kolumbija">
<li>AKT</li>
<li>Auteco</li>
</ul>
<ul class="francuska">
<li>Avinton</li>
<li>Brough Motorcycles</li>
<li>Midual</li>
</ul>
<ul class="australija">
<li>Attitude Motorcycles</li>
<li>Arqin</li>
<li>Barbarian V8 Motorcycles</li>
</ul>
<ul class="filipini">
<li>PMR</li>
<li>LuckyStar Motorcycles</li>
<li>Skygo</li>
</ul>
<ul class="austrija">
<li>Husqvarna</li>
<li>KSR Moto</li>
<li>KTM</li>
</ul>

</body>


</html>

CSS kod

body {
background-color: #A1D490;
font-size: 20px;
}

.italija {
list-style-type: square;
}

.spanija {
list-style-type: disc;
}

.brazil {
list-style-type: decimal-leading-zero;
}

.portugalija {
list-style-type: decimal;
}

.nemacka {
list-style-type: lower-roman;
}

.argentina {
list-style-type: upper-roman;
}

.japan {
list-style-type: lower-greek;
}

.juzna-koreja {
list-style-type: lower-alpha;
}

.amerika {
list-style-type: upper-alpha;
}

.kanada {
list-style-type: lower-latin;
}

.kolumbija {
list-style-type: upper-latin;
}

.francuska {
list-style-type: hebrew;
}

.australija {
list-style-type: armenian;
}

.filipini {
list-style-type: georgian;
}

.austrija {
list-style-type: none;

}

Rezultat:




Question: how to change or remove bullets?

Solution: property list-style-type.

Example:

HTML code

<!DOCTYPE html>
<html>
<head>
<title>How to change or remove bullets</title>

<meta charset="UTF-8"/>
<meta name="description" content="Description that search reads" />
<meta name="keywords" content="page keywords, keywords" />
<meta name="author" content="Marija Rikic">
<link rel="icon" type="image/png" href="images/favicon.jpg">
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>

<body>
<ul class="italy">
<li>MV Agusta</li>
<li>Aprilia</li>
<li>Benelli</li>
</ul>
<ul class="spain">
<li>Bultaco</li>
<li>Derbi</li>
<li>Gas Gas</li>
</ul>
<ul class="brazil">
<li>Agrale</li>
<li>Brasil & Movimento</li>
<li>Dafra Motos</li>
</ul>
<ul class="portugal">
<li>AJP</li>
<li>Alianca</li>
<li>Casal</li>
</ul>
<ul class="germany">
<li>BMW</li>
<li>Horex</li>
<li>Maico</li>
</ul>
<ul class="argentina">
<li>Siambretta</li>
<li>Zanella</li>
</ul>
<ul class="japan">
<li>Honda</li>
<li>Kawasaki</li>
<li>Suzuki</li>
</ul>
<ul class="south-korea">
<li>Daelim</li>
<li>KR Motors</li>
</ul>
<ul class="united-states">
<li>Alligator</li>
<li>Arch</li>
<li>Arlen Ness</li>
</ul>
<ul class="canada">
<li>Big Brute</li>
</ul>
<ul class="colombia">
<li>AKT</li>
<li>Auteco</li>
</ul>
<ul class="france">
<li>Avinton</li>
<li>Brough Motorcycles</li>
<li>Midual</li>
</ul>
<ul class="australia">
<li>Attitude Motorcycles</li>
<li>Arqin</li>
<li>Barbarian V8 Motorcycles</li>
</ul>
<ul class="phillippines">
<li>PMR</li>
<li>LuckyStar Motorcycles</li>
<li>Skygo</li>
</ul>
<ul class="austria">
<li>Husqvarna</li>
<li>KSR Moto</li>
<li>KTM</li>
</ul>

</body>


</html>

CSS code

body {
background-color: #A1D490;
font-size: 20px;
}

.italy {
list-style-type: square;
}

.spain {
list-style-type: disc;
}

.brazil {
list-style-type: decimal-leading-zero;
}

.portugal {
list-style-type: decimal;
}

.germany {
list-style-type: lower-roman;
}

.argentina {
list-style-type: upper-roman;
}

.japan {
list-style-type: lower-greek;
}

.south-korea {
list-style-type: lower-alpha;
}

.united-states {
list-style-type: upper-alpha;
}

.canada {
list-style-type: lower-latin;
}

.colombia {
list-style-type: upper-latin;
}

.france {
list-style-type: hebrew;
}

.australia {
list-style-type: armenian;
}

.phillippines {
list-style-type: georgian;
}

.austria {
list-style-type: none;

}

Result:





No comments:

Post a Comment

Note: Only a member of this blog may post a comment.