layerd出层d出图片第一次总在右下角,第二次才在页面中间

layerd出层d出图片第一次总在右下角,第二次才在页面中间,第1张

由于你d出的是一个网络,在layerd出的时候还没加载出来,layer高度为0,加载出来之后,把layer的高度挤开,所以第一次d出的就偏下了,而第二次d出资源已经加载过,直接读取缓存就行了,所以第二次d出在中间。

为什么在CSS中设定div的高度为50%,在程式码<div></div>里显示不出来 height预设值是auto 子div的height:50%是相对父div的height so 你要给父div指定Height 100%或具体画素(200px) 如果100% 你就得在指定父的父的height ………………

<div></div> 程式码 什么意思

HTML 标签,从 <div> 到</div> 构成一个块。

可以 在 <div 。。。 > 里新增 定义:

id, class ,lang, dir,

title,style ,align ,onclick, ondblclick,

onmousedown, onmouseup, onmouseover,

onmousemove, onmouseout, onkeypress,

onkeydown, onkeyup。

来增加这块网页的功能。

请问CSS里的标签:<div></div>等同于<div/>么?如果改用<div></div>的地方改用了<div/>,会导致什么后果呢

<div></div>这个是正确的程式码

<div/>而这个是错误的。,如果有这个的话会导致DIV不能闭合,会和下面的一个DIV混淆

<DIV></div>什么意思啊1~

<DIV>称为区隔标记。作用:设定字、画、表格等的摆放位置。当你把文字,图象,或其他的放在 DIV 中,它可称作为“DIV block”,或“DIV element”或“CSS-layer”,或干脆叫“layer”。而中文我们把它称作“层次”。所以当你以后看到这些名词的时候,你就知道它们是指一段在 DIV 中的 HTML。

<DIV>应用于 Style Sheet(式样表)方面会更显威力,它最终目的是给设计者另一种组织 能力,有 Class ; Style ; title ; ID 等属性,将会于Style Sheet一节才作详述,这处只介绍 一个属性设定。

以 <DIV align=center> 为例:

align="center"

可选值:center ; left ; right 。决定字、画、表格等居中、靠左或靠右。

<DIV align=center> 的作用和居中标记 <CENTER>一样,前者是由 HTML30 开始 的标准,后者是通用己久的标示法。

CSS单元的位置和层次-div标签

我们都知道,在网页上利用HTML定位文字和图象是一件“令人心痛”的事情。我们必须使用表格标签和隐式GIF图象,即使这样也不能保证定位的精确,因为浏览器和 *** 作平台的不同会使显示的结果发生变化。

而CSS能使你看到希望的曙光。利用今天我们即将学到的CSS属性,你可以精确地设定要素的位置,还能将定位的要素叠放在彼此之上,还有还有你自己慢慢看吧!

Cascading Style Sheets(CSS)是 DHTML 的基础。CSS 用来设定你网页上的元素是如何展示的。Cascading Style Sheets Positioning(CSS-P)是 CSS 的一个扩充套件,它可用来控制任何东西在网页上或是说在视窗中的位置。请你记住这两个名词:CSS 和 CSS-P。下面四个英文网址提供了详细的关于 CSS 和 CSS-P 的档案和解释。

● 1.使用 DIV 标签 (div)

当我们使用 CSS-P 的时候, 我们主要把它用在 DIV(division)tag 上。当你把文字,图象,或其他的放在 DIV 中,它可称作为“DIV block”,或“DIV element”或“CSS-layer”,或干脆叫“layer”。而中文我们把它称作“层次”。所以当你以后看到这些名词的时候,你就知道它们是指一段在 DIV 中的 HTML。

使用 DIV 的方法跟使用其他 tag 的方法一样:

<DIV>This is a DIV tag </DIV>

如果单独使用 DIV 而不加任何 CSS-P, 那么它在网页中的效果和使用 <P></P> 是一样的。

但当我们把 CSS-P 用到 DIV 中去以后,我么就可以严格设定它的位置。首先我们需要给这个可以被 CSS-P 控制的 DIV 一个 ID 或说是它的名字。比如说我们给下面这个 DIV 的名字是 truck。给名字的目的是我们以后可用 JavaScript 来控制它, 比如说移动它或改变它的一些性质等等。

<DIV ID="truck">

This is a truck

</DIV>

给层次取什么名字是随意的,名字可以是任何英文字母和数字,但第一个必须是字母。有两种把 CSS-P 应用到 DIV 的方法。

Inline CSS:Inline 是最常用的方法。

<DIV ID="truck" STYLE="styles go here">

This is a truck

</DIV>

External STYLE tag:使用 External 方法的结果是一样的。我们会在以后的课程里再详细解释这种方法。现在我们主要讨论Inline 方法。请注意在 External 方法里,在 STYLE 里的 ID 和 DIV 里的关系。

<STYLE TYPE="text/css">

<!-- #truck {styles go here} -->

</STYLE>

<DIV ID="truck">This is a truck </DIV>

Cross-Browser CSS 性质:

我们这个课程的主要目的是让你写出的网页在 NS4 和 IE4 上都能工作, 所以我们主要讨论那些对俩者都通用的性质。下面这些性质符合由 W3C 给出的标准。

position 决定 DIV tag 是如何放置的。“relative”意思是DIV的位置是相对于其他 tag 的,而“absolute”是说 DIV tag 的位置是相对于它所在的视窗。

left 相对于视窗左边的位置

相对于视窗上边的位置

width DIV tag 的宽度。所有在 DIV 里的文字或都在里面。

height DIV tag 的高度。这个性质很少用除非你想 Clip 层次。

clip 给出 layer 的 clipping(可看的见的)部分。Clip 可使得 DIV 显示为一个可以定义的很准确的方块。你可以用以下的四个值来给出这个方块的在 DIV 位置和大小。

clip:rect(,right,bottom,left);

visibility 隐蔽或展现DIV 根据它的值“visible”,“hidden”,“inherit”。

z-index DIV tag 的立 置。值越大 DIV 的位置越高。

background-color DIV 背景的颜色。

layer-background-color Netscape 的 DIV 背景颜色。

background-image DIV 的背景图象。

layer-background-image Netscape 的 DIV 的背景图象。

● 2.绝对定位和相对定位 (position)

绝对定位:

定位属性将是网虫们开启幸福之门的钥匙:

H4 { position: absolute; left: 100px; : 43px }

这项CSS规则让浏览器将<H4>的起始位置精确地定在距离浏览器左边100象素,距离其顶部43象素的位置。注意这里唯一设定了的是左边和顶部,也就说,文字将从左到右,从上到下载入浏览视窗。

左边和顶部属性很直观,左边(left)设定要素距浏览器视窗左边的距离,顶部()设定距离浏览器视窗顶部的距离。设定这些距离时,你可以使用所学过的各种度单位或比例值。使用比例值时,比例值的是相对于母体要素的尺寸。

你可以定位什么呢?任何东西!段落、单词、GIF和JPEG图象、QUICKTIME**等等。

相对定位:

绝对定位使你能精确地定位要素在页面的独立位置,而不考虑页面其它要素的定位设定。相对定位指你所定位的要素的位置相对于在档案中所分配的位置。例:

I { position: relative; left: 40px; : 10px }

相对定位的关键在于定位了的要素的位置是相对于它通常应在的位置进行定位。相对定位单元出现在普通的静态定位单元的行间,定位时没有把自己和静态定位单元完全分开。如果你停止使用相对定位,则文字的显示位置将恢复正常。使用相对定位时要小心,否则容易将页面弄得非常乱。

除了相对定位和绝对定位,你还可以使用static(静止)引数值。Static 是 position 特性的预设值。它的使用方法同普通HTML中的定位方法,不能附加特殊的定位设定。也就是说,除了边距特性,或通过使用 float 特性来浮动单元可影响单元的定位外,其它均不可以。

● 3.定位单元的控制 (width、height、visiblility)

除了控制定位单元的左上角位置,你还可以控制单元的宽度和高度,及单元在页面的可视性。

宽度:定位了的要素在页面上显示时仍然会从左到右一直显示。利用宽度属性就可以设定字元向右流动的限制,即设定要素的宽度。

DIV { position: absolute; left: 200px; : 40px; width: 150px }

浏览器接到这项规则时,它将文字按照规则规定的效果显示,还将段落的最大水平尺寸限制在150象素。

宽度属性只适用于绝对定位的要素。你可以使用我们学过的任何一种长度单位,或使用比例值设定宽度,比例值指相对于母体要素的比例。IE 4中,这项属性还可用于图象。你可以通过宽度设定人为地拉宽或压缩图象。

高度:理论上讲,高度应该和宽度的设定类似,只不过是在垂直方向上:

DIV { position: absolute; left: 200px; : 40px; height: 150px }

这里我用了“理论上讲”,因为有些浏览器不支援高度属性。

可视性:利用CSS,你可以隐藏要素,使其在页面上看不见。这条属性对于定位了的和未定位的要素都适用。

H4 { visibility: hidden }

选项:

visible 使要素可以被看见

hidden 使要素被隐藏

inherit 指它将继承母体要素的可视性设定。

值 inherit 为预设值。这使单元继承父单元的可见性。所以,如果某一段是隐藏的,则它包含的任何行间单元也都被隐藏。这一继承性可被明确指定的可见性取代。例如,段内的 EM 单元被指定为可见,这时如果该段被隐藏,则段内的所有其它内容都将消失,而唯有 EM 单元中的文字是可见的。

div边框ie与firefox高度不同,div是巢状的,如<div class=a1><div class=a2></div></div>用百分比也不行

您好!很高兴为您答疑!

可以用巢状div解决a1{border:1px solid #CCCCCC;} /控制边框/a2{height:400px;width:400px;} /控制高度/<div class=a1><div class=a2></div></div>

您可以在火狐社群了解更多内容。希望我的回答对您有所帮助,如有疑问,欢迎继续在本平台咨询。

父级不定宽高,子元素怎么,水平,垂直居。 <div id='p'> <div></div> </div>

可以设定里面div的margin属性,如:

<div id="p"> <div class="page_speeder_1326239381"></div></div>

但是这样只能是水平居中,父元素不设定宽度和高度的话,其高度一般会等于其子元素的高度。

<DIV> </DIV>是什么意思?

<div></div>是标签

<div>表示起始

</div>表示结束

把内容包含其中可以用css控制样式,<div id=>id给这个标签一个名字 然后可以用JavaScript和vbscript来控制它

<div > 设定里面的字为红色怎样来写呢?</div>

<div class="page_speeder_1165433142"> 里面的字为红色</div>

一个<div>的高度

高度 取决于 <div></div> 这个 块的需要。

当然,你可以自己定义,例如:

<HTML>

<BODY>

<div class="page_speeder_1927001247">

section

</div>

<IMG src=20160324jpg>

</BODY>

</HTML>

这里定义了 section 高度200画素,宽600画素,背景色淡兰。

<div id="head"></div> 用一个JS程式码 让DIV里面的内容 慢慢的显示出来

亲,可以使用透明度来做,刚开始透明为0最后变为1,透明度用styleopacity来 *** 作

调用layerd窗做动态内容展示的时候,只要内容不固定或者需要二次渲染

比如layuiformrender()进行渲染的时候,由于d窗已经出来了,只是content部分的结构改变了宽度或者高度,layer的d窗就不能居中了

可以使用下面这个强制居中的函数

function refreshArea(_formWin){

    var _formWinObj = $("#layui-layer"+_formWin);

      var w = _formWinObjouterWidth();

      var h = _formWinObjouterHeight();

      var l = ($(document)width()-w)/2;

      var t = ($(window)height()-h)/2;

      _formWinObjcss({

          "left":l,

          "top":t

      });

}

_formWin 是 layer窗口的index,直接传进去就行

也可以更改成传入当前d窗的类,具体可以根据自己的需求来

打开软件,我们按快捷键ctrln,建立一个新的文件。

2

点击常用,选择布局。

3

点击绘制层。

4

鼠标拖动,可以建立一个层。层的宽度是389,高度是49

5

我们再点击层,再绘制一个。我们看到,第一个层是layer1,第二个是layer2,这都是系统默认的。

6

通过界面下方属性栏,设置layer2的属性。益处设置为hidden,他的意思是,如果这个层装不下文字,就隐藏文字。

7

将光标放在layer1,然后点击插入表格。建立一个一行三列,宽388的表格。

8

在表格内输入百度经验,百度知道,百度文库,然后在属性栏设置如下属性。

9

选中layer1,然后设置layer1的属性。

10

在layer2中输入经验首页,个人中心,小测首页,帮帮首页。然后设置如下属性。

11

我们调处时间轴:点击窗口——时间轴。

12

需阿泽layer2,右键单击图中所示,然后选择添加对象。

13

鼠标将时间针定位在第一帧,然后设置layer2的高度为0。

之后我们再在时间轴上右键单击,选择添加时间轴。

右键单击,选择添加对象。

将时间针定位在第十五帧,然后让layer2的高度为0

以上步骤就添加了两个时间轴timeline1和timeline2接着,我们选中“百度经验”这个表格,在右侧的标签对话框,选择行为,点击“”。

选择时间轴,播放时间轴。

d出这个对话框,我们选择timeline1,点击确定。

接着在标签栏设置鼠标动作为onmouseover,意思是鼠标移动到上面就执行时间轴1,就会展开layer2

同样的方法,我们添加如下动作,下图有各个动作的解释。

我们按快捷键F12,来到了浏览器,看看这是一开始的效果。

接着把鼠标移动到百度经验,展开了下拉菜单。你学会了吗。

在后台添加js特效可实现这样的效果。

js代码为:

<script language="JavaScript">

<!--

var no = 5; //雪片数目

var speed = 20; //飘动速度。(值越大越慢)

var ns4up = (documentlayers) 1 : 0; //当前浏览器类型,如果是NS则为1

var ie4up = (documentall) 1 : 0; //当前浏览器类型,如果是IE则为1

var s, x, y, sn, cs;

var a, r, cx, cy;

var i, doc_width = 800, doc_height = 600;

x = new Array();

y = new Array();

r = new Array();

cx = new Array();

cy = new Array();

s = 8; //每次下落的高度,越小越平滑,但是也越慢

if (ns4up) { //以NS兼容方式

doc_width = selfinnerWidth; //取页面宽度

doc_height = selfinnerHeight; //取页面高度

}

else

if (ie4up) { //以IE兼容方式

doc_width = documentbodyclientWidth; //取页面宽度

doc_height = documentbodyclientHeight; //取页面高度

}

for (i = 0; i < no; ++ i) { //根据前面定义的雪片数目写进相应数目的层

initSnow(); //随机初始化层的坐标

if (ns4up) { //如果浏览器是NS

//用layer作为雪片(星号)的容器

documentwrite("<layer name=\"dot"+ i +"\" left=\"1\" ");

documentwrite("top=\"1\" visibility=\"show\"><font color=\"red\">");

documentwrite("</font></layer>");

}

else

if (ie4up) { //如果浏览器是IE

//用div作为雪片的容器

documentwrite("<div id=\"dot"+ i +"\" style=\"POSITION: ");

documentwrite("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");

documentwrite("visible; TOP: 15px; LEFT: 15px;\"><font color=\"red\">");

documentwrite("</font></div>");

}

}

//初始化雪片,生成随机坐标

function initSnow() {

a = 6;

r[i] = 1;

sn = Mathsin(a);

cs = Mathcos(a);

cx[i] = Mathrandom() doc_width + 1;

cy[i] = Mathrandom() doc_height + 1;

x[i] = r[i] sn + cx[i];

y[i] = cy[i];

}

//计算雪花位置,从新位置上出现,看起来就像是新产生的一样。

function makeSnow() {

r[i] = 1;

cx[i] = Mathrandom() doc_width + 1;

cy[i] = 1;

x[i] = r[i] sn + cx[i];

y[i] = r[i] cs + cy[i];

}

//雪花下落的计算

function updateSnow() {

r[i] += s;

x[i] = r[i] sn + cx[i];

y[i] = r[i] cs + cy[i];

}

//在NS浏览器上处理雪片下落的主程序

function SnowdropNS() {

for (i = 0; i < no; ++ i) { //依次处理每片雪花

updateSnow(); //下落

if ((x[i] <= 1) || (x[i] >= (doc_width - 20)) || (y[i] >= (doc_height - 20))) { //如果超出屏幕范围

makeSnow(); //则调整雪片到新位置上

doc_width = selfinnerWidth; //更新页面宽度数据

doc_height = selfinnerHeight; //更新页面高度数据

}

documentlayers["dot"+i]top = y[i]; //改变层的Y坐标,应用新的位置

documentlayers["dot"+i]left = x[i]; //改变层的X坐标,应用新的位置

}

setTimeout("SnowdropNS()", speed);

}

//在IE浏览器上处理雪片下落的主程序

function SnowdropIE() {

for (i = 0; i < no; ++ i) { //依次处理每片雪花

updateSnow(); //下落

if ((x[i] <= 1) || (x[i] >= (doc_width - 20)) || (y[i] >= (doc_height - 20))) { //如果超出屏幕范围

makeSnow(); //则调整雪片到新位置上

doc_width = documentbodyclientWidth; //更新页面宽度数据

doc_height = documentbodyclientHeight; //更新页面高度数据

}

documentall["dot"+i]stylepixelTop = y[i]; //改变层的坐标,应用新的位置

documentall["dot"+i]stylepixelLeft = x[i];

}

setTimeout("SnowdropIE()", speed); //准备下一次下落过程。

}

if (ns4up) { //如果是NS

SnowdropNS(); //调用SnowdropNS使雪片下落

}

else

if (ie4up) { //如果是NS

SnowdropIE(); //调用SnowdropIE使雪片下落

}

-->

</script>

说明:可以根据自己的需求根据说明进行相应参数的修改

控制层宽高。

area值分别为:[宽度, 高度]

当设置为auto时,意味着采用自适应(iframe层不能设置auto), 对于宽度,并不推荐您设置auto。

border: [10, 03, '#000'] 控制层的边框。

border的值分别为:[边框大小, 透明度, 颜色, layer18之前需在此处加true]

如果您不想显示border,设置 border: [0] 即可

shade: [05, '#000'] 控制遮罩。

值分别是:[遮罩透明度, 遮罩颜色, layer18之前需在此处加true]

如果不想显示遮罩,配置shade: [0]即可

shadeClose: false 用来控制点击遮罩区域是否关闭层。

若开启,设为true即可

closeBtn: [0, true] 控制层右上角关闭按钮。

closeBtn的值分别为: [关闭按钮的风格(支持0和1), true]

若不想显示关闭按钮,配置 clos

以上就是关于layerd出层d出图片第一次总在右下角,第二次才在页面中间全部的内容,包括:layerd出层d出图片第一次总在右下角,第二次才在页面中间、为什么在CSS中设定div的高度为50%,在程式码 里显示不出来、layui里面的layer模块d窗,强制居中的方法等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/web/9520425.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-04-29
下一篇2023-04-29

发表评论

登录后才能评论

评论列表(0条)

    保存