一,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. DAY7L2【C001】

    出自附中练习场[难度C]————————————————————————————————————————————————————————————— [试题描述]有 N 个任务, 每个任务最多只能完成一 ...

  2. android访问网络--okhttp

    import com.squareup.okhttp.MediaType;import com.squareup.okhttp.OkHttpClient;import com.squareup.okh ...

  3. varchar和Nvarchar区别

    http://www.cnblogs.com/yelaiju/archive/2010/05/29/1746826.html Unicode字符集就是为了解决字符集这种不兼容的问题而产生的,它所有的字 ...

  4. python 代码片段25

    #coding=utf-8 # 虽然python是面向对象的语言,但是没有显式的构造函数概念. # python没有new关键词 class MyClass(object): pass m=MyCla ...

  5. BZOJ4624 : 农场种植

    设$A[i][j]=[a[i][j]=G],B[i][j]=[b[i][j]=L]$,枚举右下角,则对应$(A-B)^2$的和就是匹配成功的格子数. $(a-b)^2=a^2+b^2-2ab$,将矩阵 ...

  6. 树形DP水题杂记

    BZOJ1131: [POI2008]Sta 题意:给出一个N个点的树,找出一个点来,以这个点为根的树时,所有点的深度之和最大. 题解:记录每个点的深度,再根据根节点的深度和逐层推导出其他点的深度和. ...

  7. Mariadb 数据库写入中文乱码问题

    从其他表里面导入数据,出现中文乱码错误.之前操作时并没有碰到类似问题,有些不得其解. 在网上搜了下,最后参考这篇文章,在执行insert前,先执行 set names gbk; 然后成功插入. 链接: ...

  8. 多表头固定demo--html Table

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. 【转】vim格式化C代码

    转自:http://blog.chinaunix.net/uid-24774106-id-3396220.html 在自己的目录下编辑自己的.vimrc, vim ~/.vimrc 添加下面的几行: ...

  10. ACM Color the fence

    Color the fence 时间限制:1000 ms  |  内存限制:65535 KB 难度:2   描述 Tom has fallen in love with Mary. Now Tom w ...