JS设置DIV的位置
JS语言是不能够直接修改DIV的位置的,因为位置属于该控件的样式,若想用JS这种脚本语言调整DIV的位置,需要调用DIV的style属性进行设置,也就是需要调整DIV的CSS样式表。修改分步骤:
1、获取到需要修改样式的元素;
2、设置调整。修改的示例代码如下: var div1 = document.getElementById('baiduSearch'); div1.style.marginTop = '225px'; 通常position的属性没有设置或设了默认值absolute,所以使用的都是静态属性,这样就可以直接通过给位置属性数值来更改元素位置。在js调用时,含‘-’的样式属性调用时需要先去掉‘-’并将下一个字母大写,下面列一下css样式表中常用到的位置属性:top right left bottom margin paddingmargin-top margin-right margin-left margin-bottompadding-top padding-right padding-left padding-bottom
在css中div定位方式有哪几种
1、position:absolute; 生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。
2、position:fixed; 生成绝对定位的元素,相对于浏览器窗口进行定位。
3、 position:relative; 生成相对定位的元素,相对于其正常位置进行定位。
4、position:static; 默认值。没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明)。
5、position:inherit; 规定应该从父元素继承 position 属性的值。
css里面怎么让一个DIV居中
第一种方式:设置body 居中。在CSS中的代码是(body{text-align:center;})第二种方式:用盒子模型,首先设置一个Div ,这个DIV的宽度为100%,然后在这个DIV居中,那么在这个DIV中加的内容就居中显示,代码如下:<div ><div ></div></div>CSS 样式代码:<style type="text/css">.div1{text-align:center;width:100%;}.div2{width:980px;background:red;} //为了看清效果,加了背景颜色</style>第三种方式:margin:0 auto;
通常的方法为:先设置div的宽度,然后使用如下样式:
1margin: 10px auto; /* 上下边距10px,左右边距自动以达到左右居中的目的*/以下为示例:
HTML代码中给出div
123 <div > <div ></div></div>添加样式
1234567 /*外层边框*/div.outer{width:200px;height:150px;border:1px solid green;}div.content{ width:100px;height:50px; /*设置大小*/ margin:20px auto; /*设置左右边距自动以使其居中*/ border:1px solid red;}显示效果