html js设置文字垂直居中,javascript实现在指定元素中垂直水平居中

本章节介绍一下如何实现未知宽高的元素在指定元素下实现垂直水平居中效果，下面就以span元素为例子，介绍一下如何实现span元素在div中实现水平垂直居中效果，代码如下:

#box{

width:200px;

height:150px;

background:blue;

position:relative;

}

#antzone{

background:green;

}

window.οnlοad=function(){

var obox=document.getElementById("box");

var oantzone=document.getElementById("antzone");

var w=oantzone.offsetWidth;

var h=oantzone.offsetHeight;

oantzone.style.position="absolute";

oantzone.style.left="50%";

oantzone.style.top="50%";

oantzone.style.marginLeft=-(w/2)+"px";

oantzone.style.marginTop=-(h/2)+"px";

}

脚本之家

上面你的代码实现了span元素在div中垂直水平居中效果，下面简单介绍一下它的实现过程。

html js设置文字垂直居中,javascript实现在指定元素中垂直水平居中相关推荐

js java 改变字体颜色,js设置文字颜色的方法示例
本文实例讲述了js设置文字颜色的方法.分享给大家供大家参考,具体如下: aaabbbccc 不允许在h1标签中添加任何字符,可以通过css或js定义,使其aaa为红色bbb为黄色ccc为蓝色 /p&g ...
Java 文件操作二（重命名、设置只读、是否存在、指定目录中创建文件、获取文件修改日期、创建文件、文件路径比较）
文件重命名 import java.io.File;public class Main {public static void main(String[] args) {File oldName = ...
js和jQuery判断数组是否包含指定元素
最近遇见一些前台基础性问题,在这里笔者觉得有必要记录一下,为了以后自己查阅或者读者查看. 已知var arr = ['java','js','php','C++']; 问题:arr数组是否包含'jav ...
html+js+显示文字时钟,JavaScript canvas实现文字时钟
本文实例为大家分享了canvas实现文字时钟的具体代码,供大家参考,具体内容如下先看看效果图代码 Document 您的浏览器不支持canvas var c=document.getElement ...
html js设置颜色渐变效果,Javascript 颜色渐变效果的实现代码
下面就是博主的一些思路和解决办法,如果对此没兴趣,想直接使用jquery插件的同学,可以点这里思路每一种颜色由RGB组成,每两位为一个16进制数当前颜色代码和目标颜色代码,转换成10进制数后,是 ...
js javaScript array 取指定元素索引、判断是否相同、重复、过滤数据
最近写js也多了,Array中有好多方法不够用.自己加了些以后还可能用到. <script type="text/javascript"> //找到返回所在索引,不存在 ...
JS鼠标点击自动选中点击元素中的文字
目录 1. 选中输入框(input.textarea等)中的文字 2.普通标签(div.p.span等) 1. 选中输入框(input.textarea等)中的文字 <form action=& ...
JavaScript删除数组指定元素
input文字垂直居中_CSS的带文字居中分析
CSS居中的方法有特别多,这里只介绍最基本的方法. CSS中分块级元素和内联元素,但是块级元素或者内联元素都可以设置display,最常用的三种display--inline.block.inline ...

html js设置文字垂直居中,javascript实现在指定元素中垂直水平居中

html js设置文字垂直居中,javascript实现在指定元素中垂直水平居中相关推荐

最新文章

热门文章