代码改变世界

利用ul,li,span,position:relative实现文本的居中显示

2015-08-21 15:46  怡红院丿无痕  阅读(372)  评论(0)    收藏  举报
#rock_star {
                padding: 30px;
                border: 1px solid #FF0000;
                list-style: none;
            }
            #rock_star li {
                border: 1px solid #FF0000;
                width: 100px;
                height: 30px;
                text-align: center;
            }

            #rock_star li span {
                position: relative;
                top: 6px;
            }
<ul id="rock_star">
                    <li>
                        <span>张博伟</span>
                    </li>
                    <li>
                        <span>张思德</span>
                    </li>
                    <li>
                        <span>张芳芳</span>
                    </li>
                    <li>
                        <span>张哥哥</span>
                    </li>

                </ul>