`
xiaoer_1982
  • 浏览: 1815191 次
  • 性别: Icon_minigender_2
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

CSS元素POSITION的用法一例

CSS 
阅读更多

CSS元素POSITION的用法一例

左直拳

页面上用到了Atlas的控件<atlas:UpdateProgress以便在进行各种操作时显示一个等待图标,给用户解解闷,好让他们在漫长的等待结果的岁月中不那么烦躁,知道系统正在忙。

形如:

<atlas:UpdateProgress ID="UpdateProgress1" runat="server" >

<ProgressTemplate>

<img src="../images/loading.gif" alt="请稍候..." />

</ProgressTemplate>

</atlas:UpdateProgress>

可是这样写的话图标就歪在一边,不显眼。如果写上个绝对定位,比如

style="position:absolute;left:400px;top:300px;",可这仅仅适合800*600的屏幕,而用户的屏幕分辨率千差万别。

最后发觉可以用百分比,这样写:

<atlas:UpdateProgress ID="UpdateProgress1" runat="server" >

<ProgressTemplate>

<img src="../images/loading.gif" alt="请稍候..." style="position:absolute;left:50%;top:50%;"/>

</ProgressTemplate>

</atlas:UpdateProgress>

这样不管什么情况下,图标都会居于页面之中。

分享到:
评论

相关推荐

    css伪元素 长方体 css伪元素 长方体

    css伪元素 长方体css伪元素 长方体css伪元素 长方体css伪元素 长方体css伪元素 长方体css伪元素 长方体css伪元素 长方体css伪元素 长方体css伪元素 长方体css伪元素 长方体css伪元素 长方体css伪元素 长方体css伪...

    css_position用法详解

    这个对CSS的Position讲的很详细,希望对大家有帮助。嘎嘎。不要骂我。

    CSS之Position详解

    CSS之Position详解 CSS的很多其他属性大多容易理解,比如字体,文本,背景等。有些CSS书籍也会对这些简单的属性进行大张旗鼓的介绍,而偏偏忽略了对一些难缠的属性讲解,有避重就轻的嫌疑。CSS中主要难以理解的...

    css 元素的渐变色练习

    borderGradientcss-borderGradientcss-borderGradientcss-borderGradientcss-borderGradientcss 元素的渐变色练习css 元素的渐变色练习css 元素的渐变色练习css 元素的渐变色练习css 元素的渐变色练习css 元素的渐变...

    css元素常见定位应用.html

    对定位属性值进行详解,和...在本文中,任何一个元素都被文本流所限制了自身的位置,但是通过CSS我们依然使得这些元素可以改变自己的位置,我们可以通过float来让元素浮动,我们也可以通过margin来让元素产生位置移动。

    CSS Position

    NULL 博文链接:https://sugongqing.iteye.com/blog/323093

    CSS或者JS实现鼠标悬停显示另一元素

    想达到鼠标悬停到元素a上,显示另一个元素b,可以通过css实现也可以通过js实现。 js: 写两个函数:mouseenter,mouseleave,例如:其中 $("#a").mouseenter(function() { $("#b").show("normal"); }); $("#a")....

    CSS中背景background-position负值定位

    CSS中背景background-position负值定位 CSS中背景background-position负值定位 CSS中背景background-position负值定位 CSS中背景background-position负值定位 CSS中背景background-position负值定位

    详解css position 5种不同的值的用法

    position属性指定用于元素的定位方法的类型(静态,相对,固定,绝对或粘性)。 有五种不同的值:   •static •relative •fixed •absolute •sticky 然后使用top,bottom,left和right属性定位元素。但是,除非...

    css_position.pdf

    css_position.pdf

    美工:css元素

    css元素

    CSS 同级元素position:fixed和margin-top共同使用的问题

    主要介绍了CSS 同级元素position:fixed和margin-top共同使用的问题的相关资料,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

    CSS中背景图片定位方法:background-position的用法

    CSS中背景图片定位方法:background-position的用法,附带算法

    css中position:fixed实现div居中上下左右居中

    实现div居中的方法多如牛毛,本例为大家介绍的这个方法是使用css中position:fixed来实现div上下左右居中,这个小技巧比较使用,大家看看

    CSS使用position:sticky 实现粘性布局的方法

    前面写了一篇文章讲解了position常用的几个属性:《CSS基础篇– position属性讲解》 一般都知道下面几个常用的: { position: static; position: relative; position: absolute; position: fixed; } 在...

    DIV CSS布局中position属性用法深入探究

    本文向大家描述一下DIV CSS布局中的position属性的用法,position属性主要有四种属性值,任何元素的默认position的属性值均是static,静态。这节课主要讲讲relative(相对)以及absolute(绝对)。 如何学习DIV+CSS...

    CSS-position(定位)

    CSS-position(定位)中的static、relative、fixed、absolute、sticky以及重叠的简单应用

    css3实现多个元素依次显示效果

    在css3中,我们使用animation与keyframes结合,可以给元素添加各种各样的动画效果。这篇文章主要介绍了css3实现多个元素依次显示效果,需要的朋友可以参考下

    css中position:fixed实现div在窗口上下左右居中

    实现div居中的方法有很多,本例介绍的使用css中position:fixed来实现div的上下左右居中,下面以一个DIV 元素在浏览器窗口居中为例

    Web前端与移动开发之复合选择器 css元素显示模式 背景属性.txt

    只选择父元素最近一级的子元素 即必须是亲儿子 选择器1 选择器2可以是任意基础选择器 (3)并集选择器(重要) 可以选择多组标签 定义相同样式 通常用于集体声明 语法 元素1, 元素2{样式声明} 元素1和元素...

Global site tag (gtag.js) - Google Analytics