リストからドットを削除するには

Question

下のスニペットのように詳細リストでリンクを実装したいのですが、ドット付きリストを削除したいのですが、下の図のようにドットなしでリストだけを表示したいのです。私は以下のイメージのように達成したい。

.sidebarleft h2 { 
 
    margin: 0.0em 0 0.3em; 
 
    letter-spacing: -.001em; 
 
    padding: 5px 10px; 
 
    background: #461B7E url() repeat-x bottom left; 
 
    font: bold 13px Arial; 
 
    color: #fff; 
 
    text-transform: uppercase; 
 
    border-bottom: 1px solid #cccccc; 
 
} 
 

 

 

 
h2 { 
 
    margin: 0.5em 0 .25em; 
 
    font: normal bold 14px Arial, Tahoma, Helvetica, FreeSans, sans-serif; 
 
    line-height: 1.4em; 
 
    text-transform: uppercase; 
 
    letter-spacing: .01em; 
 
    color: #4b05bf; 
 
} 
 

 
.sidebarleft .widget-content { 
 
    margin: 0 auto; 
 
    padding: 5px 9px 5px 10px; 
 
} 
 
.sidebarleft ul { 
 
    list-style: none; 
 
    margin: 0 0 0; 
 
    padding: 0 0 0; 
 
} 
 

 

 
.sidebarleft li { 
 
    display: inline; 
 
    margin: 0 auto; 
 
    padding: 0 auto; 
 
} 
 

 

 

 

 

 
.sidebarleft a:link, .sidebarleft a:visited { 
 
    color: #0000FF; 
 
    text-decoration: none; 
 
} 
 

 
.sidebarleft li a { 
 
    font: normal 12px verdana; 
 
    text-transform: none; 
 
    margin: 0; 
 
    padding: 3px 0px 4px 5px; 
 
    display: block; 
 
    text-indent: 0px; 
 
    border-bottom: 1px solid #aebcfd; 
 
    line-height: 1.3em; 
 
} 
 
a:visited { 
 
    color: #0000ff; 
 
    text-decoration: none; 
 
} 
 
a:link { 
 
    color: #4b05bf; 
 
    text-decoration: none; 
 
} 
 

 
.sidebarleft ul { 
 
    list-style: none; 
 
    margin: 0 0 0; 
 
    padding: 0 0 0; 
 
} 
 

 
.sidebarleft a:link, .sidebarleft a:visited { 
 
    color: #0000FF; 
 
    text-decoration: none; 
 
} 
 

 

 

 
.sidebarleft li a { 
 
    font: normal 12px verdana; 
 
    text-transform: none; 
 
    margin: 0; 
 
    padding: 3px 0px 4px 5px; 
 
    display: block; 
 
    text-indent: 0px; 
 
    border-bottom: 1px solid #aebcfd; 
 
    line-height: 1.3em; 
 
} 
 
a:visited { 
 
    color: #0000ff; 
 
    text-decoration: none; 
 
} 
 
a:link { 
 
    color: #4b05bf; 
 
    text-decoration: none; 
 
} 
 
.sidebarleft ul { 
 
    list-style: none; 
 
    margin: 0 0 0; 
 
    padding: 0 0 0; 
 
}

<div class="widget Label" data-version="1" id="Label6"> 
 
<h2>Latest IT Jobs in India - By Location</h2> 
 
<div class="widget-content list-label-widget-content"> 
 
<ul> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Bangalore</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Chennai</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Hyderabad</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in India</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Noida</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Mumbai</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Pune</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Gurgaon</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs In Delhi</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in kolkata</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Coimbatore</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Ahmedabad</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Mohali</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Chandigarh</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Jaipur</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Cochin</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Haryana</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Andhra Pradesh</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Indore</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Kochi</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Tamilnadu</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Trivandrum</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Visakhapatnam</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Vijayawada</a> 
 
</li> 
 
<li> 
 
<a dir="ltr" href="">Jobs in Mysore</a> 
 
</li> 
 
</ul> 
 

 
</div> 
 
</div>

Answer 1

li { 
    list-style-type: none; 
} 

しかし、あなたは、一般的にいくつかのクラスを使用する必要があり、オブジェクト型のCSSを書くことは本当に悪い考えです

Answer 2

あなたは非表示にするコードの下に使用することができますドット。

ul li{ 
    list-style: none; 
} 

liに任意のクラス名を追加して、そのクラスを使用することもできます。