`
raozhiyong11
  • 浏览: 138478 次
  • 性别: Icon_minigender_1
  • 来自: 江西
社区版块
存档分类
最新评论

DIV+CSS网页居中--笔记

 
阅读更多

样式不多只要4个，轻松搞定网页DIV水平居中。在<body>和</body>加入全局DIV就能把整个网页居中，毫不费劲。

注意要点：float:none;  必不可少即初始化float

居中：margin:0 auto

网页宽度：width:950px;

兼容浏览器：display:block;

 

如下：

首先必须加HTML头声明

<!DOCTYPEhtml> 或者<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">

 

 

开始全局居中的DIV

 

<div style=" width:950px;display:block; float:none; margin:0 auto"></div>

说明:如果放入css里调用，那么先把div 定义ID <div id="centers"></div>，然后复制style=“” 引号部分到CSS里用#centers{ width:950px;display:block; float:none; margin:0 auto;}

如果想要再兼容IE5.5 那么在CSS body 加上一个样式 text-align:center; IE5.5 也就居中了

就这样搞定啦！！

分享到：
| 日志框架学习之一：commons-logging+log4j
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    DIV+CSS学习笔记

    【DIV+CSS学习笔记】 在网页设计中，`DIV+CSS`是一种常用的技术，用于创建布局和控制网页元素的样式。这种技术的核心是利用`&lt;div&gt;`元素作为容器，通过CSS（Cascading Style Sheets）来定义这些容器的样式，从而实现...

    韩顺平轻松搞定网页设计html+(DIV+CSS)+javascript视频笔记(全).pdf

    CSS（Cascading Style Sheets）用于控制网页的样式和布局。在HTML中，可以通过 `style` 属性直接应用CSS，或通过外部样式表链接。在案例中，`border` 属性用于为图片添加边框，例如： ```html ``` 对于更复杂的布局...

    Html\CSS+DIV学习笔记(史上最实用的CSS笔记)

    在Web开发领域，HTML、CSS和DIV是构建网页的基础元素。HTML负责创建网页的结构，CSS用来处理页面的样式和布局，而DIV则作为一个容器元素，常用于组织和布局网页内容。以下是对这些知识点的详细说明： 1. **Web标准*...

    html+css学习笔记.pdf

    在HTML+CSS学习笔记中，我们重点讨论了以下几个CSS知识点： 1. **CSS选择符**： - **标签选择符**：通过HTML标签名如`&lt;p&gt;`，`&lt;h1&gt;`等来指定样式。 - **ID选择符**：使用`#`后跟唯一的ID名称，适用于页面中只出现...

    前端HTML5+CSS+JavaScript学习笔记.docx

    `&lt;div&gt;`是布局的重要工具，它可以包裹其他元素并用CSS进行样式控制，用于创建页面的区域划分。`&lt;a&gt;`标签创建超链接，`href`属性指定链接的目标地址，`target`属性可以设定链接在何处打开，如`_blank`表示新窗口，`_...

    前端笔记前端笔记前端笔记前端笔记,一些div居中以及常用的CSS属性

    本篇笔记主要探讨了如何使`div`元素居中以及一些常用的CSS属性，这些都是前端开发者日常工作中不可或缺的基础知识。 一、`div`元素居中方法 1. **margin自动填充**：设置`div`的`margin`为`auto`，可以使其在父...

    html+css笔记

    而 CSS 则是用来美化网页，控制页面布局、颜色等外观特性的语言。通过合理地使用这些标签和样式，可以创建出美观且功能丰富的网站。 以上内容仅为 HTML 和 CSS 的基本介绍，实际上它们的功能远不止于此。为了更好地...

    CSS+DIV学习笔记(史上最实用的CSS笔记).pdf

    【CSS+DIV学习笔记概述】 本笔记主要涵盖了CSS（Cascading Style Sheets）的基础知识，以及如何通过CSS和DIV来构建符合Web标准的静态页面。Web标准的核心是将内容、结构和表现分离，以提高可访问性、可维护性和易用...

    html网页css笔记

    使用 CSS 和 DIV 元素可以创建复杂而灵活的网页布局。 - **# 与 . 的区别**： - `#` 用于 ID 选择器。 - `.` 用于 类选择器。 - **ID 与 Class 的区别**： - **Class** 可以在多个元素中重复使用。 - **ID** ...

    jQuery+CSS3点击弹出邮箱订阅窗口代码.zip

    而CSS3，则为网页样式添加了更多动态效果，提升了页面的视觉吸引力。本文将详细介绍如何使用jQuery和CSS3实现一个点击弹出邮箱订阅窗口的功能。 首先，我们关注到这个压缩包中的核心文件：`index.html`，这是网页的...

    CSS学习笔记

    ### CSS学习笔记 #### CSS简介 CSS（Cascading Style Sheets）是一种用于定义HTML文档样式的语言，可以增强网页的表现力，实现样式与结构的分离。通过CSS，开发者能够更灵活地控制页面布局、字体、颜色等外观特性，...

    纯css实现div容器内图片上下左右居中效果.zip

    本资源"纯css实现div容器内图片上下左右居中效果.zip"提供了一个使用纯CSS实现图片在div容器内完全居中的解决方案。下面将详细解释这一技术及其背后的原理。 首先，我们关注的是“纯CSS”方法，这意味着我们将不...

    css3代码属性Flexbox实现内部div上下居中效果.zip

    这个压缩包“css3代码属性Flexbox实现内部div上下居中效果.zip”包含了如何使用Flexbox来让内部div在垂直方向上居中的实例。下面将详细介绍Flexbox的相关概念和如何实现此效果。 1. **Flexbox基本概念** - **Flex...

    text-align,vertical-align,line-height居中布局笔记

    如果想要让多个`&lt;div&gt;`元素在同一行中居中对齐，可以将它们的`display`设置为`inline-block`，并设置`vertical-align`为`middle`。需要注意的是，当使用`vertical-align: middle`时，通常还需要配合`line-height`...

    CSS基础笔记

    ### CSS基础笔记详解 #### 一、将CSS加入网页的方式 在网页开发中，CSS（层叠样式表）被广泛用于控制网页的外观与布局。根据所提供的内容，我们可以看到有四种方式来添加CSS： 1. **链接外部样式表**： - 使用...

    韩顺平 轻松搞定网页设计html (DIV CSS) javascript视频笔记(全).doc

    在网页设计领域，HTML、CSS和...随着学习深入，CSS用于美化布局，JavaScript则让网页具备交互性，这三者共同构成了网页设计的基石。了解并熟练掌握这些基础知识对于任何想要涉足网页设计的人来说都是至关重要的。

    AnyFo - CSS 九阳神功

    在Web开发领域，CSS（Cascading Style Sheets）是用于控制网页元素样式和布局...这份笔记对于提升CSS技能，优化网页设计具有很高的参考价值。学习并掌握这些知识点，能够帮助开发者更高效地创建美观且功能完善的网页。

    有条理、完整详细 前端笔记

    ### 有条理、完整详细的前端笔记知识点梳理 #### 第1章：HTML介绍 - **1-1 代码初体验，制作我的第一个网页** - HTML文档的基本结构。 - 如何编写并保存一个简单的HTML文件。 - 使用浏览器打开HTML文件的方法。 ...

Magicbox
Global site tag (gtag.js) - Google Analytics