CSS入门指南——页面的水平居中

 我们经常看到这样的网页,即内容水平居中在屏幕中间,左右留白。我们来给这样的布局起个名字——水平居中布局

 

其实要实现这样的布局十分简单,即给中间部分一个宽度,设置margin左右值为auto,如,中间部分class="main"

.main{width:1200px;margin:0 auto;  
}

这样,中间部分就以1200px的宽度水平居中了,当屏幕宽度小于1200时,会自动覆盖

 


补充一下关于  margin——页面外边距 和 padding——页面内边距  的知识,请看另一篇随笔。

http://www.cnblogs.com/tanghm/p/9022923.html

 

转载于:https://www.cnblogs.com/tanghm/p/9022901.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/367042.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

python控制台执行代码字符串_编写Python脚本以使用控制台命令执行

研究是在底部,阅读之前。。。谢谢。在我必须编写一个运行SQL查询的Python脚本。我创建了一个主类,名为SQLQuery。每个SQLQuery实例表示一个查询。脚本的结构必须如下所示:class SQLQuery(object):def __init___(self, string_myQuery)...inst…

Linux Tools Quick Tutorial 学习记录

总体 书籍链接 find命令 查找大于多少的文件 find / -type f -size 5M | xargs ls -lh | awk {print $5, $9} | ls -lrt

mysql explain的使用

一、explain返回各列的含义: 1、table:显示这一行的数据是关于那张表的 2、type:重要的列,显示连接使用了何种类型,从最好到最差的连接类型为const、eq_reg、ref、range、index、ALL 3、possible_keys:显示…

使用 Canvas 生成公众号头图

熟悉“前端晚自修”的朋友们应该知道,我们每期的头图除了上面的文字随着每期变动以外,几乎是一模一样的(因为太懒了~)。这个头图虽然丑了一点,但是也还说的过去,毕竟是我倾尽毕生艺术细胞拼出来的&#xff…

通过快速Java和文件序列化加快速度

从Java的第一个版本开始&#xff0c;每天都有许多开发人员试图至少达到与C / C 一样好的性能。 JVM供应商正在通过实现一些新的JIT算法来尽力而为&#xff0c;但仍有许多工作要做&#xff0c;尤其是在我们如何使用Java方面。 例如&#xff0c;对象<->文件序列化有很多优…

Flask mysql 模版传参_Flask渲染Jinja2模板和传参

### Flask渲染Jinja2模板和传参&#xff1a;1. 如何渲染模板&#xff1a;* 模板放在templates文件夹下* 从flask中导入render_template函数。* 在视图函数中&#xff0c;使用render_template函数&#xff0c;渲染模板。注意&#xff1a;只需要填写模板的名字&#xff0c;不需要…

08 Spring框架 AOP (一)

首先我们先来介绍一下AOP&#xff1a; AOP&#xff08;Aspect Orient Programming&#xff09;&#xff0c;面向切面编程&#xff0c;是面向对象编程OOP的一种补充。 面向对象编程是从静态角度考虑程序的结构&#xff0c;面向切面编程是从动态的角度考虑程序运行过程。 AOP底层…

使用Spring 3.2的DeferredResult进行长轮询

在我们的最后一集中 &#xff0c; Agile Cowboys Inc.的首席执行官刚刚雇用了Java / Spring顾问&#xff0c;方法是为他提供最初为女友购买的保时捷。 这位首席执行官的女友因失去保时捷而感到不安&#xff0c;已将其婚外情告诉了他的妻子。 他的妻子在分拆了CEO的套房后已申请…

移动spa商城优化记(一)---首屏优化篇

背景 随着公司业务的不断壮大&#xff0c;最近老是有用户反应公司APP内的商城打开比较慢&#xff0c;这可不行啊&#xff0c;慢了容易流失用户&#xff0c;流失用户减少公司业绩&#xff0c;公司业绩少我的年终奖就少…………&#xff0c;所以为了公司&#xff0c;也为了自己&a…

hprose for java 教程_hprose for java源码分析-4

4.1 疑窦丛生书接上回。上回说到&#xff0c;从HproseClient.java ------------------------- (#0)invokeHandler.handle()开始&#xff0c;将经历一个漫长的调用过程&#xff0c;下面把整个调用链粘出来&#xff0c;先认识下这个庞然大物。( >>> 表示调用到&#xff…

Git可视化极简易教程 — Git GUI使用方法

Git可视化极简易教程 — Git GUI使用方法 学习了&#xff1a;http://www.runoob.com/w3cnote/git-gui-window.html转载于:https://www.cnblogs.com/stono/p/9026292.html

如何用堆栈来保存和恢复滚动条位置

问题背景 在单页应用中&#xff0c;翻页一般通过display:none将先前的面板&#xff08;一般就是个div容器&#xff09;隐藏&#xff0c;然后将本次需要展现的面板设置成display:block&#xff08;当然&#xff0c;还可能加点css切换动画&#xff0c;不过不影响我们本次的讨论结…

如何在Hibernate中维护表的历史记录

为了维护数据库的历史记录或跟踪数据库表行的修改&#xff0c;我们创建了一个版本表&#xff0c;其中包含与原始表相同的字段。每当原始表被更改时&#xff0c;我们都会在版本表中创建另一个条目。 因此&#xff0c;对于每个更新查询&#xff0c;我们都必须在版本表中编写一个插…

java批量提取文件夹名称_bat 批量提取指定目录下的文件名

bat 批量提取指定目录下的文件名下面是批量获取指定目录下的文件名的核心代码echo offecho text inputset inputset /p input:echo %input% is inputcd %input%rem echo onfor %%a in (*) do (echo %%a is input)cd ..如下是sql server执行对应脚本文件sqlcmd -Spcserver -dmas…

埃及分数The Rotation Game骑士精神——IDA*

IDA*&#xff1a;非常好用的搜索&#xff0c;可以解决很多深度浅&#xff0c;但是规模大的搜索问题。 估价函数设计思路&#xff1a;观察一步最多能向答案靠近多少。 埃及分数 题目大意&#xff1a; 给出一个分数&#xff0c;由分子a 和分母b 构成&#xff0c;现在要你分解成一…

[UE4]创建Shooter基类,2种方法

一、可以通过直接修改"BP_FPPCharacter"的名字为“BP_Shooter”作为基类&#xff0c;然后新建一个"BP_FPPCharacter"继承自“BP_Shooter”。 这种方法适用于各个类对"BP_FPPCharacter"依赖不多的情况。 二、创建一个“BP_Shooter”继承于“Chara…

美团扫码付的前端可用性保障实践

开篇 2017年&#xff0c;美团金融前端遇到了很多通用性问题&#xff0c;特别是在保障前端可用性的过程中&#xff0c;我们团队也踩了不少“坑”&#xff0c;在梳理完这些问题以后&#xff0c;我们还专门做了第31期线下沙龙给大家进行了分享。不管是在面试过程中与候选人讨论&a…

Servlet上传文件和下载文件示例

Java Web应用程序中的文件上载和下载以及常见任务。 由于最近我写了很多有关Java servlet的文章 &#xff0c;因此我想提供一个使用servlet上传和下载文件的示例示例。 用例 我们的用例是提供一个简单HTML页面&#xff0c;客户端可以在其中选择要上传到服务器的本地文件。 在提…

用java单源最短路径问题_单源最短路径-贪心算法

单源最短路径&#xff0c;关于这个问题的贪心算有点不好理解&#xff0c;分析后续补充&#xff0c;代码也需要后续优化&#xff0c;便于理解package test;import java.util.ArrayList;import java.util.HashMap;import java.util.List;import java.util.Map;/*** Created by sa…

APPLE STORE

直接在设置中&#xff0c;使用查看APPLE ID是无法更改的&#xff0c;现在必须要有所在区域的信用卡信息&#xff0c;支付方式无法像以前一样选择“无”。 查询后发现&#xff0c;有人说icloud3.0,即这个旧版的可以进行更改&#xff0c;于是下载。 但发现一个问题&#xff0c;输…