<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<title>项目实战--PC端固定布局</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body> <nav id="nav">
<section class="center">
<h1>旅游</h1>
<ul class="link">
<li class="active"><a href="###">首页</a></li>
<li><a href="###">资讯</a></li>
<li><a href="###">新闻</a></li>
<li><a href="###">简介</a></li>
</ul>
</section> </nav> <header>header</header>
<section>body</section>
<footer>footer</footer> </body>
</html>
@charset "utf-8";

body,h1,ul{
margin: 0;
padding: 0;
} ul{
list-style: outside none none; //简写属性 在一个声明中设置所有的列表属性。
} a{
text-decoration: none; //CSS文字修饰为无;一般用于设置清除超链接的默认下划线:
} #nav {
width: 100%;
height: 70px;
background-color: #333;
}
.center{
width: 1263px;
height: 70px;
margin: 0 auto; }
.center h1{
width: 240px;
height: 70px;
text-indent: -9999px;
float: left;
}
.link{
width: 650px;
height: 70px;
line-height: 70px;
color: #eee;
float: right;
}
.link li{
width: 120px;
text-align: center;
float: left;
}
.link a{
color: #eee;
display: block; //
} .link a:hover,
.active a{
background-color: #000;
}

style.css

css初级代码的更多相关文章

  1. css 初级进阶

    摘自:https://www.jianshu.com/p/dcc40ccc9841 CSS中级 Class和ID选择器 CSS初级教程中我们可以使用HTML标签选择器定义样式. 同样你也可以使用Cla ...

  2. 根据判断PC浏览器类型和手机屏幕像素自动调用不同CSS的代码

    1.媒体查询方法在 css 里面这样写 -------------------- @media screen and (min-width: 320px) and (max-width: 480px) ...

  3. css初始化代码

    最近老有新项目开发,一直在找存留的CSS初始化代码,索性放到这里备份下, @charset "utf-8"; /* -------------------------------- ...

  4. 网站哀悼变灰代码集合 兼容所有浏览器的CSS变暗代码

    下面这些CSS代码可以把网站的网页变为黑白,只需将代码加到CSS文件或网页最顶端就可以实现素装.建议全国站长动起来.为遇难的同胞哀悼. 如何将网站变成灰色调呢,网站变灰色方法是什么?有哪些?为了方便大 ...

  5. CSS透明代码

    透明往往能产生不错的网页视觉效果,先奉上兼容主流浏览器的CSS透明代码: .transparent_class { filter:alpha(opacity=50); -moz-opacity:0.5 ...

  6. 各大门户网站的css初始化代码

    腾讯QQ官网 css样式初始 body,ol,ul,h1,h2,h3,h4,h5,h6,p,th,td,dl,dd,form,fieldset,legend,input,textarea,select ...

  7. CSS颜色代码 颜色值 颜色名字大全(转载)

    CSS颜色代码 颜色值 颜色名字大全 转载处http://flyjj.com/css-colour-code.html 颜色值 CSS 颜色使用组合了红绿蓝颜色值 (RGB) 的十六进制 (hex) ...

  8. CSS颜色代码大全

    CSS颜色代码大全 转载:http://blog.163.com/wujinhongisme@126/blog/static/3613698020095115919389/ RGB ( Red,Gre ...

  9. 兼容主流浏览器的CSS透明代码

    透明往往能产生不错的网页视觉效果下面是兼容主流浏览器的CSS透明代码.transparent_class {  filter:alpha(opacity=50);  -moz-opacity:0.5; ...

随机推荐

  1. linux下将一个大的文件拆分成若干小文件

    命令:split,例子: 以行数拆分 -l参数: split –l 50 原始文件 拆分后文件名前缀 说明:以50行对文件进行拆分,最后一个文件的行数没有50行以实际行数进行分配,比如有一个名为 wl ...

  2. Linux使用gcc编译时设置编码格式

    我们编写 C 程序时,可以使用 ANSI 编码,或是 UTF-8 编码:在编译程序时,可以使用以下的选项告诉编译器: -finput-charset=GB2312 -finput-charset=UT ...

  3. VSCode配置MSVC+VSCode使用easyx库,2021.5.13日配置

    VSCode配置MSVC+VSCode使用easyx库,2021.5.13日配置~~ 想必很多人和我一样,想用vscode编程c++,easyx库不支持MinGW,一般人都是直接使用vs2019安装e ...

  4. 7. IDEA概述和安装

    1.1IDEA概述 IDEA全称InteliJ IDEA,是用于Java语言开发的继承环境,它是业界公认的目前用于Java程序开发的最好工具 集成环境:把代码编写,编译,执行,调试等多种功能综合到一起 ...

  5. 认识 Spring Cloud Alibaba

    个人理解 Spring Cloud Alibaba 就是 Spring Cloud 的微服务规范的一种实现,外加一些阿里云的商业组件 Spring Cloud 是什么 Spring Cloud 为开发 ...

  6. [刷题] 70 Climbing Stairs

    要求 楼梯共有n个台阶,每次上一个台阶或两个台阶,一共有多少种上楼梯的方法? 示例 输入:n=3 [1,1,1],[1,2,],[2,1] 输出:n=3 实现 自顶向下(递归) 递归 1 class ...

  7. shell练习(1)创建100个用户

    shell练习(1)创建100个用户 默默努力的小白. 2020-04-15 16:28:49 49 收藏文章标签: linuxshell版权随机创建100个用户,并生成随机密码,并将密码放入一个文件 ...

  8. 像素 PIXEL 图片的基本单位 像素非常小 图片是成千上万的像素组成 显示/屏幕分辨率 (DPI 屏幕分辨率)

    像素 PIXEL 图片的基本单位 像素非常小 图片是成千上万的像素组成 显示/屏幕分辨率 (DPI 屏幕分辨率) 图像分辨率 (PPI) 1920*1080是像素点长度1920个像素点 X1080个像 ...

  9. Canal--服务端和客户端搭建

    服务端 源码编译 git clone https://github.com/alibaba/canal.git 用IDEA打开克隆的项目 等待maven下载完依赖后开始编译过程 依赖下载完成后,打开m ...

  10. 关于UCOSII的学习资料

    UCOSII学习资料: 在战舰的A盘资料包中 ->软件资料->ucosii 有一个叫做简易OS讲解的文档,此文从简单的OS将其,通俗易懂的讲解大体的OS运行原理,任务调度的实现过程,是入门 ...