li的list-style小圓點和文字沒有居中對齊?
<ul> <li><a>我们开始</a></li> <li><a2016</a></li></ul>.ul li{ list-style:disc inside;}
感覺小圓點和文字沒有居中對齊(小圓點在偏下一點),有什麼方法使他們居中對齊嗎?
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>demo</title></head><style type="text/css"> *{padding:0; margin:0; list-style:none;} .list{ width:600px; margin:10px auto;} .list li:before{ content:''; width:4px; height:4px; border-radius:50%; background:#000; display:inline-block; margin-right:5px; vertical-align:middle; margin-top:-3px;} </style> <body> <ul class="list"> <li>呵呵!</li> <li>别说话吻我</li> <li>小火车怎么这么污?</li> </ul></body></html>
一般這樣的情況,我都是自己用before偽類自己寫一個、
自己用span寫一個點就很好控制了,去掉ul的list-style
試試看line-height,和目前li的高度一樣;
以上是css:li中的list-style小圓點和文字沒有居中對齊的解決方法的詳細內容。更多資訊請關注PHP中文網其他相關文章!