<!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. C++ primer plus读书笔记——第1章 预备知识

    第1章 预备知识 1. Ritchie希望有一种语言能将低级语言的效率.硬件访问能力和高级语言的通用性.可移植性融合在一起,于是他在旧语言的基础上开发了C语言. 2. 在C++获得一定程度的成功后,S ...

  2. 关于Annotation注解的理解

    在编Java程序的时候,我们经常会碰到annotation.比如:@Override 我们在子类继承父类的时候,会经常用到这个annotation.它告诉编译器这个方法是override父类的方法的. ...

  3. MySQL优化|一分钟带你了解单表优化

    在开始前,分享给大家我看过觉得讲数据库讲的算是很不错的,也在B站拥有百万播放量的教程. 这个MySQL视频是动力节点的老杜讲解,个人也很喜欢老杜的教学风格,老杜真的是从MySQL基础一点点带我入门,基 ...

  4. [c++] 基本概念

    内存 栈区和堆区的管理模式有所不同:栈区内存由系统分配和释放,不受程序员控制:堆区内存完全由程序员掌控,想分配多少就分配多少,想什么时候释放就什么时候释放,非常灵活. 栈(Stack)可以存放函数参数 ...

  5. [刷题] 206 Reverse Linked List

    要求 反转一个链表 不得改变节点的值 示例 head->1->2->3->4->5->NULL NULL<-1<-2<-3<-4<-5 ...

  6. Spark 集群安装部署

    安装准备 Spark 集群和 Hadoop 类似,也是采用主从架构,Spark 中的主服务器进程就叫 Master(standalone 模式),从服务器进程叫 Worker Spark 集群规划如下 ...

  7. 066.Python框架DRF之序列化器Serializer

    一 序列化器-Serializer 作用: 1. 序列化,序列化器会把模型对象转换成字典,经过response以后变成json字符串 2. 反序列化,把客户端发送过来的数据,经过request以后变成 ...

  8. TcaplusDB君 · 行业新闻汇编(5月25日)

    TcaplusDB君一直密切关注着游戏行业和数据库行业的动态.以下是TcaplusDB君收集的近期的游戏行业和数据库行业的新闻,汇编整理,献给大家观看. (本篇文章部分内容来自网络) 第十一届中国数据 ...

  9. Spring-Cloud之Feign原理剖析

    Feign 主要是帮助我们方便进行rest api服务间的调用,其大体实现思路就我们通过标记注解在一个接口类上(注解上将包含要调用的接口信息),之后在调用时根据注解信息组装好请求信息,接下来基于rib ...

  10. PHP8开启PHPStorm + Xdebug3

    下载Xdebug 需要下载对应php版本xdebug 否则对加载xdebug失败 https://xdebug.org/download 我的是PHP版本 为php8.0.3-nts-x64 安装xd ...