AP DIV元素(绝对定位)如何水平居中网页

Dreamweaver中,要使AP DIV元素(即绝对定位的DIV标签)能在不同分辨率的电脑上始终保持水平居中是一个头疼的问题,它不像相对定位的DIV可以通过margin:0 auto;水平居中网页。下面我分享个人的一个处理办法,希望对新手有帮助。

操作方法

  • 01

    新建AP DIV层,作为父级,设置代码为position:absolute;left:50%;top:0px;width:200px;height:100%;z-index:1;其中,宽度width:200px可以是任意值,最主要是left:50%一定要有,才能使其左边框居中。

  • 02

    在上面的父级层里新建子级层,假设你想设计网页宽度为980px,那么以下子级层只要设置left:-490px;width:980px;则子级的左边框向左出去一半而被父级的左边框均分,这样,分辨率变化也不影响它居中,而父级,不放内容即可,如果怕它影响,可将其宽度设为0。

  • 03

    下一层同理,而顶部边距则可以根据自己的需要调节其垂直位置,只要父级的height为100%(其实任意值都可以),那么子级可以在任意垂直位置。例如第一个height:60px;top:0px,那么第二个则top:60px,即可。往下层同理。 注意:实现这个方法的前提是所有的层都是position:absolute;这个值。

(0)

相关推荐

  • Dreamweaver CS6如何应用:[26]AP Div布局

    AP Div是HTML中的重要组成元素之一,网页可以通过AP Div实现对页面的规划和布局,下面,我们一起来看一下关于AP Div的基础知识和基本操作吧 一.的格式 01 div元素是一个块元素,在其 ...

  • html的div元素使用

    在html中常用div元素 <div> 是一个块级元素 下面介绍html的div元素使用 希望能帮助到大家 操作方法 01 <div> 是一个块级元素 使用div设置网页 标题 ...

  • html的div元素中id使用

    通用属性可以用于任何的html5元素 id属性用于指定元素的识别名称是唯一的一般结合css和javascript来选择元素 下面介绍html的div元素中id使用 希望能帮助到大家 操作方法 01 如 ...

  • HTML 为div元素如何设置背景颜色

    给div元素设置背景色可以通过以下几种方式实现: 1)在div元素的style属性上设置background-color,此种只能一个一个的div设置,不能批量 2)使用css设置div元素的back ...

  • Dreamweaver学习:[29]网页中如何编辑AP DIV层

    接着上一篇的层元素的内容,通过一些实例来进一步巩固和学习如何编辑层. 操作方法 01 打开Dreamweaver,新建一个HTML文件.点击绘制层,在窗口内创建一个图层. 02 在属性面板中更改层的属 ...

  • css样式如何设置div元素水平垂直居中的三种方法

    CSS实现绝对定位元素的居中效果,有时候需要把一个元素进行居中,在这里讲解三种方法,各种方法有它的优缺点. 操作方法 01 1.建立txt文档,更改后缀名为html,如图: 02 2.右击html文件 ...

  • jQuery 选择器,jQuery如何选择div元素

    jQuery 元素选择器和属性选择器允许您通过标签名.属性名或内容对 HTML 元素进行选择. 选择器允许您对 HTML 元素组或单个元素进行操作. 操作方法 01 jQuery 元素选择器 jQue ...

  • div+css网页设计基础教程

    div+css是一个网页设计师,程序员必经之路,是网站建设的基础!div+css是网页设计的最重要的元素. 操作方法 01 一.准备工作,电脑一套,Dreamweaver(网页设计软件) Dreamw ...

  • CSS3如何实现元素水平居中、垂直居中

    CSS3如何实现元素水平居中.垂直居中 水平居中 01 行内元素 如果被设置元素为文本.图片等行内元素时,水平居中是通过给父元素设置 text-align:center来实现的 02 定宽块状元素 当 ...