ul{

text-align:center;

}

li{

display:inline

}

这样li元素不需要float且可以居中

比较好样式如下

ul li {
// float: left;
padding: 0 3px;
list-style: none;
cursor: pointer;
color: #cce5ff;
font-size: 16px;
text-align: center;
border-left: 1px solid #cce5ff;
display: inline;
} ul li:first-child {
border: none;
} ul li:hover {
color: #1264A5;
}

ul的li元素水平并居中的css的更多相关文章

  1. 如何使ul中li元素横向排列且不换行

    外层div容器宽度固定,ul宽度随li(li宽度固定)的增加而撑开,但是当ul中li的宽度之和大于div时,ul没有撑开,而是li换行了,如何使li不换行? 解决方法:主要是外面容器设置为white- ...

  2. CSS 各类 块级元素 行级元素 水平 垂直 居中问题

    元素的居中问题是每个初学者碰到的第一个大问题,在此我总结了下各种块级 行级 水平 垂直 的居中方法,并尽量给出代码实例. 首先请先明白块级元素和行级元素的区别 行级元素 一块级元素 1 水平居中: ( ...

  3. ul中li元素横向排列且不换行

    ul { white-space: nowrap; } li { display: inline-block; }     white-space 属性设置如何处理元素内的空白. normal 默认. ...

  4. ul列表li元素横排显示的IE兼容性问题

    目标: 使ul列表横排显示 现象: 谷歌OK,火狐竖排,IE竖排. 原因: ul原css代码: 首先,去除点号,list-style:none;为了使其横排,使用了display:contents;该 ...

  5. html中ul元素水平排列问题

    <!DOCTYPE html> <html> <head> <style> #pic_list { display:block; white-space ...

  6. ul或者ol中添加li元素

    <!doctype html><html>    <head>        <meta charset="utf-8">      ...

  7. 二级ul li元素动态加载click事件

    一.代码 html代码: <ul class="id1" id="id1" style="width:84%; height:75%;overf ...

  8. css3-7 如何让页面元素水平垂直都居中(元素定位要用css定位属性)

    css3-7 如何让页面元素水平垂直都居中(元素定位要用css定位属性) 一.总结 一句话总结:元素定位要用css定位属性,而且一般脱离文档流更加好操作.先设置为绝对定位,上左都50%,然后margi ...

  9. ul列表元素在float:right后li元素倒转

    发现对li元素进行float:right后,虽然成功右浮动,但是的元素是倒转的 解决方案: 对ul进行右浮动,然后对li左浮动 结果

随机推荐

  1. Java 之 System 类

    java.lang.System 类中提供了大量的静态方法,可以获取与系统相关的信息或系统级操作. 一.标准输入.标准输出和错误输出流对象 PrintStream err:“标准”错误输出流. Inp ...

  2. App的开发过程(转载)

    来源:https://www.cnblogs.com/sanwenyu/p/7234616.html 不同的项目管理模式或许会有完全不同的流程步骤.但是专业性几乎是保证产品质量的唯一准则. App的开 ...

  3. Sql Server设置用户只能查看并访问特定数据库

    现需要限定特定的用户只能查看并访问特定的数据库,防止多个用户对数据库操作时一些误操作. 参考i6first的如何让用户只能访问特定的数据库(MSSQL)博文 1.新建登录用户 以管理员身份登陆数据库( ...

  4. Springboot+Mybatis的逆向工程

    Mybatis逆向工程,自动生成 entity类和常用的增删改查方法. 1.pom.xml引入类 <!-- 通用mapper 用于mabatis封装的基础增删改查的功能--><dep ...

  5. Prometheus学习笔记(5)Grafana可视化展示

    目录 一.Grafana安装和启动 二.配置数据源 三.配置dashboard 四.配置grafana告警 一.Grafana安装和启动 Grafana支持查询Prometheus.从Grafana ...

  6. Mock Server之接口信息从DB获取

    上一篇,写了Mock Server的基础实现与被测系统的对接 当我们mock的接口信息.返回值等时不时维护时,都要在代码中编辑,那体验就不太好了,如果这些可以直接在浏览器编辑就好了. 因此对后端部分做 ...

  7. Android 还可以走多久?

    最近,有位知识星球的球友问我这么一个问题: 我做 Android 开发五年多时间了,但是最近总是很焦虑,看着人工智能越来越火,很担心 Android 要不行了,想问下,我现在要转行么?Android ...

  8. AppDomain.Unload_MarshalByRefObject

    internal string GetClassInfo(string assemblyName, string className, string strField) { string ret = ...

  9. Excel——读取——导出目录

    /** * 导出Excel文件到具体的目录 * <一句话功能简述> * <功能详细描述> * @param fileName 导出的文件名 * @param sheetName ...

  10. python - django 设置自定义文件保存路径

    一. settings.py MEDIA_URL = "/qir/" # 设置获取文件时的访问根路径 MEDIA_ROOT = os.path.join(BASE_DIR, &qu ...