<!DOCTYPE html>
<html lang="en">
<head>

    <meta charset="UTF-8">
    <style>
    *{
        margin: 0;
        padding: 0;
    }
        /*相同的样式我们可以使用并集选择器*/
    .top,
    .banner,
    .main,
    .footer {
        width: 960px;
        margin: 0 auto;
        margin-bottom: 10px;
        text-align: center;
    }
        .top{
            height: 80px;
            background-color: pink;
        }
        .banner{
            height: 120px;
            background-color: #0a2ffe;
        }
        .main{
            height: 500px;
            background-color: hotpink;
        }
        .footer{

            height: 150px;
            background-color:black;
        }
    </style>
    <title>Title</title>
</head>
<body>
<div class="top">top</div>
<div class="banner">banner</div>
<div class="main">main</div>
<div class="footer">footer</div>

</body>
</html>

css3学习——一列固定宽度且居中的更多相关文章

  1. css3学习笔记之多列

    CSS3 创建多列 column-count 属性指定了需要分割的列数. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 <!D ...

  2. css3学习文档

    什么是CSS3? CSS3是CSS2的升级版本,3只是版本号,它在CSS2.1的基础上增加了很多强大的新功能. 目前主流浏览器chrome.safari.firefox.opera.甚至360都已经支 ...

  3. 十天精通CSS3学习笔记 part4

    CSS3中的变形与动画(下) CSS3 Keyframes介绍 Keyframes 被称为关键帧,其类似于Flash中的关键帧.在CSS3中其主要以"@keyframes"开头,后 ...

  4. CSS3学习

    1.CSS3边框 border-radius:创建圆角边框 border-radius:25px; -moz-border-radius:25px; /* 老的 Firefox */ box-shad ...

  5. HTML5 CSS3学习

    HTML5 CSS3学习 :http://www.1000zhu.com/course/css3/ HTML5 相关书籍:   http://www.html5cn.com.cn/news/gdt/2 ...

  6. CSS3学习之圆角box-shadow,阴影border-radius

    最近经常玩腾讯微博,出来职业习惯,看看它的CSS,里面运用了大量的css3的东东,有一处用到了Data URI,还有css e­xpression有争议的地方,对png24图片的处理也是用滤镜,类似( ...

  7. css和css3学习

    css和css3学习 css布局理解 css颜色大全 样式的层叠和继承 css ::before和::after伪元素的用法 中文字体font-family常用列表 cursor属性 css选择器 F ...

  8. CSS3学习笔记(3)-CSS3边框

    p{ font-size: 15px; } .alexrootdiv>div{ background: #eeeeee; border: 1px solid #aaa; width: 99%; ...

  9. CSS3之多列布局columns详解

    CSS3之多列布局columns详解 CSS3提供了个新属性columns用于多列布局.基本属性如下: 1. columns: <'column-width'> || <'colum ...

随机推荐

  1. [git]将代码上传到github

    1.右键你的项目,如果你之前安装git成功的话,右键会出现两个新选项,分别为Git Gui Here,Git Bash Here,这里我们选择Git Bash Here,进入如下界面 2.接下来输入如 ...

  2. web中间件常见漏洞总结笔记

    之前看吐司别人发的个文档,简单记的笔记 ----- IIS     解析漏洞        IIS 6            *.asp;.jpg会被当作asp解析            *.asp/ ...

  3. CSPS模拟 61

    T1 模拟 T2 ?? T3 哈希

  4. 表格可拖拉列改变列大小（使用的时候将youElement全部替换称你要添加这个效果的元素，需是jqery的选择器格式，如：$("table th/td")）

    $(function () { var isMouseDown = false; var currentTh = null; youElement.bind({ mousedown: function ...

  5. [转载]2.2 UiPath条件判断活动Flow Decision的介绍和使用

    一.Flow Decision介绍 FlowDecision节点是一个条件节点,它根据指定条件是否成立来控制流程的两个分支. 当条件为True时,流程执行一个分支 当条件为False时,流程执行另外一 ...

  6. 线性模型之逻辑回归(LR)(原理、公式推导、模型对比、常见面试点)

    参考资料(要是对于本文的理解不够透彻,必须将以下博客认知阅读,方可全面了解LR): (1).https://zhuanlan.zhihu.com/p/74874291 (2).逻辑回归与交叉熵 (3) ...

  7. java数组、字符串拼接

    1. 数组实现拼接 int[] arr ={11,22,33,44,55,66}; System.out.print("["); for (int i = 0; i <arr ...

  8. python中字典的基础操作

    dict1 = { 'name':'王麻子', 'age':25, 'phone':12580, 'high':160 } dict2 = { 'name':'张三', 'age':38, 'phon ...

  9. 《计算机网络 自顶向下方法》 第3章 运输层 Part2

    待补充完善 TCP 相关基本点 1.面向连接 两个不同主机上的进程在通过 TCP 进行通信之前,必须先通过三次握手来建立 TCP 连接 2.全双工服务 即,如果一台主机上的进程 A 与另一台主机上的进 ...

  10. Linux 部署Nginx反向代理服务 使用openssl自生成证书并配置https

    1.安装Nginx编译所依赖的包 正常centos中可以使用yum安装一下依赖包: yum install -y gcc gcc-c++ pcre pcre-devel zlib zlib-devel ...