css怎么打开项目栏

html-css07

css怎么打开项目栏,第1张

打开“CSS样式面板（Shift+F11）”，单击“新建CSS样式”按钮，打开“新建CSS样式”对话框2、参数设置如下：注：1）名称以“· ”开头2）“当前文档”与“新建样式表文件”的区别 3、单击“确定”，设置相应参数：4）应用css样式：选中文字，单击“属性面板”中的“样式”选项下的“text”即可。4、新建样式表文件 1）新建css样式2）设置如下的参数（注意名称前应以“· ”开头）3）单击“确定”按钮，保存样式表文件4）设置字体样式，参数设置如下：（5）应用样式表文件

导航栏=链接列表

作为标准的HTML基础一个导航栏是必须的

。在我们的例子中我们将建立一个标准的HTML列表导航栏。

导航条基本上是一个链接列表，所以使用 <ul>和 <li>元素非常有意义：

<ul>

<li><a href="#home">主页</a></li>

<li><a href="#news">新闻</a></li>

<li><a href="#contact">联系</a></li>

<li><a href="#about">关于</a></li></ul>

从列表中删除边距和填充：

ul {

list-style-type: none margin: 0 padding: 0}

1、在电脑上打开软件，新建一个html文件，在head部分，编写css样式， list-style-type: none是除掉导航前面默认带的点，li a，li a.active ，li a:hover:not(.active) 设置鼠标滑到导航栏的颜色变化。

2、在html页面body里面编写导航栏内容，可以看到是通过<ul><li><a href=""></a></li></ul>的格式来实现导航。

3、在浏览器中打开页面，可以看到已经制作成了一个比较美观的垂直导航栏。

4、将鼠标滑向垂直导航栏的列表项上，可以看到列表项颜色发生变化。

5、也可以制作成水平导航栏，overflow: hidden代码的意思是超出高度和宽度的部分自动隐藏，float: left使导航栏水平显示。

6、在浏览器中打开页面，可以看到制作出美观的水平导航栏，已经置顶了。