一，ul--li列表水平排列，切居中对齐

　　主要是利用Li标签中的display属性。设置为display:inline，使li纵向排布，且能够使用text-align:center;使其居中显示

　　HTML结构：

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>练习</title>

 </head>

 <body>

 <div id="bNav" class="bNav">

  <ul>

   <li><a href="index.aspx" title="Home">Home</a></li>

   <li>|</li>

   <li><a href="info.aspx?info_id=8" title="About Us">About Us</a></li>

   <li>|</li>

   <li><a href="info.aspx?info_id=9" title="Department Design">Department Design</a></li>

   <li>|</li>

   <li><a href="info.aspx?info_id=10" title="Law Declaration">Law Declaration</a></li>

   <li>|</li>

   <li><a href="info.aspx?info_id=11" title="Contact Us">Contact Us</a></li>

   <li>|</li>

   <li><a href="info.aspx?info_id=12" title="Application Agent">Application Agent</a></li>

   <li>|</li>

   <li><a href="info.aspx?info_id=13" title="Job Services">Job Services</a></li>

   <li>|</li>

   <li><a href="info.aspx?info_id=14" title="Apply Link">Apply Link</a></li>

  </ul>

 </div>

 </body>

 </html>

　　CSS代码：　

 #bNav{

 margin-top:10px;

 background:#D9EBF5;

 text-align:center;

 }

 #bNav ul{

 padding:4px 0;

 margin:;

 overflow:hidden;

 }

 #bNav ul li{

 display:inline;

 padding:;

 }

　　效果图：

　　

CSS成长之路----知识点篇的更多相关文章

  1. Java游戏服务器成长之路——感悟篇

    又是一个美好的周末啊,现在一到周末,早上就起得晚,下午困了又会睡一两个小时,上班的时候,早上起来喝一杯咖啡,然后就能高效的工作一整天,然而到了周末人就懒散了,哈哈. 最近刚跳槽,到新公司已经干了有两周 ...

  2. Python成长之路第二篇（1）_数据类型内置函数用法

    数据类型内置函数用法int 关于内置方法是非常的多这里呢做了一下总结 (1)__abs__(...)返回x的绝对值 #返回x的绝对值!!!都是双下划线 x.__abs__() <==> a ...

  3. python成长之路第二篇（4）_collections系列

    一.分别取出大于66的数字和小于66的数字 小练习:需求要求有一个列表列表中存着一组数字,要求将大于66的数字和小于66的数字分别取出来 aa = [11,22,33,44,55,66,77,88,9 ...

  4. Python成长之路第二篇（3）_字典的置函数用法

    字典的置函数用法(字典dict字典中的key不可以重复) class dict(object): """ dict() -> new empty dictionar ...

  5. Python成长之路第二篇（2）_列表元组内置函数用法

    列表元组内置函数用法list 元组的用法和列表相似就不一一介绍了 1)def append(self, p_object):将值添加到列表的最后 # real signature unknown; r ...

  6. python成长之路第一篇（5）文件的基本操作

    一.三元运算 我们在上章学习的if,,else,,有一种简便的方法 他的表达式是这样的:变量 = 值1 if 条件 else 值2 解释过来就是如果aaa等于sss则输出值1否则输出值2 二.类的概念 ...

  7. Python成长之路第一篇（3）_初识字典

    经过上章的学习我们已经了解到了列表可以通过索引来获取对应的值,在本章我们将学到通过名字来索引数据,这种结构的类型称之为映射(maooing),在Python中字典是唯一内建的映射类型,其中的值我们称之 ...

  8. Python成长之路第一篇（4）_if,for,while条件语句

    有了以上的基本基础,已经上面写的几个小练习,大家肯定有很多的不满,比如查询为什么查询一次就退出了呢?下面我们来学习条件语句 一.万恶的加号 以前我们在print的时候如果要加上变量都有是使用+来作为连 ...

  9. Python成长之路第一篇（2）-初识列表和元组

    可以将列表和元组当成普通的“数组”,他能保存任意数量任意类型的Python对象,和数组一样都是通过数字0索引访问元素,列表和元组可以存储不同类型的对象,列表和元组有几处重要区别.列表元素用([])包括 ...

随机推荐

  1. AC自动机+全概率+记忆化DP UVA 11468 Substring

    题目传送门 题意:训练指南P217 分析:没有模板串也就是在自动机上走L步,不走到val[u] == v的节点的概率 PS:边读边insert WA了,有毒啊! #include <bits/s ...

  2. MFC CString to char* (Visual Studio 2015 亲测可用)

    右键划线部分,打开属性,然后找到:配置属性-常规-字符集,选择:使用多字节字符集 然后,char *c;CString str; 就可以 strcpy(c,str); 如果觉得好用,请点个赞,谢谢!

  3. EBay .Net SDK Api 实践

        1.请求流程介绍   提供SOA地址:https://api.ebay.com/wsapi   WSDL生成的代码在WebService.cs文件当中.   ApiCall封装了所有的RPC, ...

  4. javascript document.compatMode属性

    文档模式在开发中貌似很少用到,最常见的是就是在获取页面宽高的时候,比如文档宽高,可见区域宽高等. IE对盒模型的渲染在 Standards Mode和Quirks Mode是有很大差别的,在Stand ...

  5. three.js透视投影照相机

    透视投影照相机(Perspective Camera)的构造函数是: THREE.PerspectiveCamera(fov, aspect, near, far) 让我们通过一张透视照相机投影的图来 ...

  6. Jquery和JS获取ul中li标签

    js 获取元素下面所有的li var content=document.getElementById("content"); var items=content.getElemen ...

  7. [linux]unixODBC的安装配置说明

    什么是unixODBC: ODBC(Open Database Connect)是由Microsoft 公司于1991 年提出的一个开放的,用于访问数据库的统一接口规范. unixODBC的是为非Wi ...

  8. ACM 背包问题

    背包问题 时间限制:3000 ms  |  内存限制:65535 KB 难度:3   描述 现在有很多物品(它们是可以分割的),我们知道它们每个物品的单位重量的价值v和重量w(1<=v,w< ...

  9. ACM 笨小熊

    笨小熊 时间限制:2000 ms  |  内存限制:65535 KB 难度:2   描述 笨小熊的词汇量很小,所以每次做英语选择题的时候都很头疼.但是他找到了一种方法,经试验证明,用这种方法去选择选项 ...

  10. 基于S5PC100裸机程序之SPI(上)

    作者:杨老师,华清远见嵌入式学院讲师. SPI作为应用最为广泛的通信总线协议之一,开发人员应当掌握,本章将介绍SPI总线协议的基本理论,以及S5PC100的SPI总线控制器的操作方法. 1. SPI总 ...