接下来的这一节我计划解说的是超链接和列表的样式，然后我们做出一个导航栏出来，事实上导航栏是很常见的，可是我们这里做得这个有点并不那么完好，等我们学完了css之后再完好它。

**************超链接*************

1.我们讲伪类的时候已经讲到了，一个超链接能够有link（正常状态）、visited（已经訪问过）、hover（获得鼠标焦点）active（被鼠标点击中）这样四个状态，我们前面也分别设置过不同的颜色了，使用选择器:伪类的形式。

2.我们还能够使用background-color来设置其背景颜色，我们能够用text-decoration：none来去掉超链接的下划线。

*************列表**************

1.我们前面讲HTML的时候讲过，列表分为有序列表和无序列表，我们这里解说它的一个属性：list-style-type。

2.list-style-type属性是什么意思呢，就是列表的风格类型，对于无序列表，能够用circle和square，即分别用圆形和方形来作为无序列表的开头。

3.list-style-type属性还能够取值为upper-roman来设置为大写罗马数字，还能够用lower-alpha来设置为小写的英文字母。

4.它另一个属性是list-style-image：用图片来作为列表项的开头，它须要用url导入一个图片，这个我们后面再说。

***********实现一个导航栏*************

1.第一步，我们先来一个无序列表，然后给他们加上超链接，因为这里我不知道连接到哪里，用#表示一个空连接，以下我们新建一个my.html代码例如以下：

<html>

<head>

    <title>2014年辛星CSS教学夏季版</title>

    <link rel="stylesheet" type="text/css" href="my.css">

</head>

<body>

    <ul>

        <li><a href="#">辛星</a></li>

        <li><a href="#">小倩</a></li>

        <li><a href="#">小楠</a></li>

        <li><a href="#">辛勇</a></li>

        <li><a href="#">辛强</a></li>

    </ul>

</body>

</html>

2.然后新建一个my.css文件例如以下：

ul{list-style-type: none;}

a{text-decoration: none;}

li{display: inline;}

3.我们的这个横向的导航条就算完毕了，可是它还是太简单了，它仅仅是单纯的列出了五个连接，而且水平排列，我们到后面再去完好。

4.这里说明一下，这个li属性的display：inline表示设置格式为内联，即它不是以块级元素出现的，是内联元素，即向右排列而不是向下排列。

*************小结*************

1.本小节我们认识了超链接和列表的常见样式。

2.然后我们做出来了一个简易的导航条，读者能够先去完好它，假设读者不去做，我后面再做。

2014年度辛星解读css第四节的更多相关文章

  1. 2014年辛星解读css第五节

    本小节我们解说css中的"盒模型".即"box model",它通经常使用于在布局的时候使用,这个"盒模型"也有人成为"框模型&q ...

  2. 2014年辛星解读css第六节

    这一节我们就要讲到布局了,事实上布局本身特别简单.可是要合理的布好局就不那么简单了,就像我们写文章一样.写一篇文章非常easy,可是要写一篇名著就非常难了,这须要我们扎实的功底和对文学的理解,可是.千 ...

  3. 2014年辛星解读css第一节

    CSS是Cascading Style Sheets的缩写.即层叠样式表,它用于表现HTML的样式,即HTML仅仅是去写该网页有哪些内容,至于怎样去表现它们,由CSS去定制. ************ ...

  4. 2014年辛星解读css第二节

    第一节我们简单介绍了一下CSS的工作流程,我相信读者会有一个大体的认识,那么接下来我们将会深入的研究一下CSS的细节问题,这些问题的涉及将会使我们的工作更加完好. *************凝视*** ...

  5. 2014年辛星解读css第三节

    第二节我们讲述的差点儿全是CSS的选择器,那么以下这一节我们来讲一下CSS的颜色和文本的一些东西,尽管我对调色不大敏感.可是对于颜色还是比較感兴趣的. *********CSS中的颜色******** ...

  6. 2014年度辛星html教程夏季版第二节

    上面一节中我们介绍了HTML文件的书写和几个标签,接下来我们来认识几个其他的标签,这里我们主要介绍一下head标签和文本标签. ***************head标签*************** ...

  7. 2014年度辛星html教程夏季版第一节

    从今天起开始在博客园开启自己的html教程啦,先从第一节开始把,首先推荐一个网站,就是http:/www.w3cschool.cc,这是一个公开的教学网站,但是它有一个问题,那就是虽然很全面,但是不是 ...

  8. 2014年度辛星css教程夏季版第四节

    接下来的这一节我计划讲解的是超链接和列表的样式,然后我们做出一个导航栏出来,其实导航栏是非常常见的,但是我们这里做得这个有点并不那么完善,等我们学完了css之后再完善它. ************** ...

  9. 2014年度辛星css教程夏季版第五节

    本小节我们讲解css中的”盒模型“,即”box model“,它通常用于在布局的时候使用,这个”盒模型“也有人成为”框模型“,其实原理都一样,它的大致原理是这样的,它把一个HTML元素分为了这么几个部 ...

随机推荐

  1. QT对话框中show和exec的区别

    转自:http://hi.baidu.com/wangjuns8/blog/item/24b382460dd1c1338694737d.html QDialog的显示有两个函数show()和exec( ...

  2. 在Python中使用正则表达式同时匹配邮箱和电话并进行简单的分类

    在Python使用正则表达式需要使用re(regular exprssion)模块,使用正则表达式的难点就在于如何写好p=re.compile(r' 正则表达式')的内容. 下面是在Python中使用 ...

  3. 1.1-学习Opencv与MFC混合编程之---利用画图函数，生成视频，并写入视频文件

    源代码地址:http://download.csdn.net/detail/nuptboyzhb/3961674 写视频文件 Ø 新建菜单项,Learning OpenCV——> OpenCVr ...

  4. Windows server 2008 R2实现多用户远程连接

    原文 Windows server 2008 R2实现多用户远程连接 经常使用远程桌面的朋友可能会注意到,Windows server 2008 R2中,远程桌面最多只允许两个人远程连接,第三个人就无 ...

  5. uva 705

    题意,给你迷宫算出其中个封闭空间的个数,以及求出所有封闭的空间的最大步长,但是给你的迷宫式“/”,“\”来标记的所以需要将每个格子分开来3*3的格子来算, 一开始按照2*2来算,2*2有临界情况不好算 ...

  6. 【免费】iPhone上最好用的短信群发软件： 高速短信4.1

    免费的最新的联系人.群组.多人发送短信软件短信群发4.1已经出炉.欢迎下载! *归属地信息让你时时记着好友的地方,让陌生号码变得不陌生:  *您能够选择最经常使用的联系人然后发送高速短信; *群联系人 ...

  7. OpenVPN多处理之-netns容器与iptables CLUSTER

    假设还是沉湎于之前的战果以及强加的感叹,不要冥想,将其升华. 1.C还是脚本 以前,我用bash组织了复杂的iptables,ip rule等逻辑来配合OpenVPN,将其应用于差点儿全部能够想象得到 ...

  8. find . / -newer oldest_file.txt ! -newer newest_file.txt

    如果希望查找更改时间比某个文件新但比另一个文件旧的所有文件,可以使用-newer选项. 它的一般形式为: $ find . / -newer oldest_file.txt ! -newer newe ...

  9. MingW环境下的windows编程

    一般在进行windows编程时都使用vc++精简版,其插入菜单,图片等资源等更简单,且vc中对中文有更好的支持,win7下安装的Mingw中文并不能很好地显示,有光标显示的位置和光标实际位置不符的问题 ...

  10. ssh登录过程详细介绍

    服务器端和客户端就取得了相同的会话密钥和会话 ID .对于后续传输的数据,两端都会使用会话密钥进行加密和解密,保证了数据传送的安全. http://blog.csdn.net/lhq9220/arti ...