display&position

display:block　将子对象作为块对象呈递。很多内联样式的效果，需要用到display。


#photo a img{border:3px solid #FF6600; }
#photo a:hover {display:block;} /**若不加此句，则内联对象img的样式不会显示**/
#photo a:hover img{ border:2px solid blue;}

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

position　内容的尺寸根据布局尺寸确定对象的尺寸。


#text{position:relative;} /**若没有，则内联对象不显示。若为block，会作为块级元素而使虚线过长。posigion时，长度由text的内容决定。**/
#text span{width:200px; height:20px;border-bottom: 1px dashed #000000 ;
}

示例文字 下划线样式

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

赞 (0)

相关推荐

  • display&position

    display&position

    display:block 将子对象作为块对象呈递.很多内联样式的效果,需要用到display. #photo a img{border:3px solid #FF6600; } #photo a:hover {display:block;} /**若不加此句,则内联对象img的样式不会显示**/ #photo a:hover img{ border:2px solid blue;} [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] position 内容的尺寸根据布局尺寸确定对象的尺

  • javascript获取隐藏元素(display:none)的高度和宽度的方法

    js获取可见元素的尺寸还是比较方便的,这个可以直接使用这个方法: 复制代码 代码如下: function getDefaultStyle(obj,attribute){ // 返回最终样式函数,兼容IE和DOM,设置参数:元素对象.样式特性 return obj.currentStyle?obj.currentStyle[attribute]:document.defaultView.getComputedStyle(obj,false)[attribute];} 但是如果这个元素是隐藏(dis

  • 网页在线视频播放代码大全

    使用说明:把代码中的视频路径换成与自己的相对路径或绝对路径,播放器的窗口大小,根据需要修改高和宽的参数. 1.avi格式 复制代码 代码如下: <object id="video" width="400" height="200" border="0" classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA"><param name=&quo

  • 在线播放器代码大全

    1.avi格式 <object id="video" width="400" height="200" border="0" classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA"><param name="ShowDisplay" value="0"><param name="

  • JObj预览一个JS的框架

    我的时间不多,大部分是在工作之余写的. 复制代码 代码如下: JObj.Dom.$tag("INPUT")    .$filter(function(o){        var fa = o.parentNode.parentNode.parentNode;     return f =(o.type == "text" && fa.id == "hollerNew") ? true : false;    })    .$cs

  • js Canvas实现圆形时钟教程

    js Canvas实现圆形时钟教程

    阅读本文需要一点关于canvas基本用法的基础,本文实例为大家分享了HTML5 Canvas实现圆形时钟简易教程 第一步:新建一个最简单的html文件,并且在<body>标签中定义元素canvas. canvas.html <html> <head> <title>Canvas clock tutorial</title> </head> <body> <canvas id="clock" wid

  • Javascript公共脚本库系列(一): 弹出层脚本

    Javascript公共脚本库系列(一): 弹出层脚本

    一.摘要 本系列文章是为了抽象通用的,跨浏览器的脚本方法. 本篇文章讲解弹出浮动层的javascript函数, 以及函数的原理和使用注意事项. 二.实现效果 用脚本弹出浮动层是我们最常用的脚本方法之一.下面是效果图:  点击图中的"航空公司"后,会在"航空公司"下面弹出浮动层. 在网上弹出框的脚本相当多, 而且还有各种第三方JS框架可供我们使用.但是其中有的脚本过于简单,仅仅粗略的实现弹出效果而忽略了灵活性,通用性和跨浏览器特性. 使用JS框架又有些杀鸡用牛刀.所以

  • Bootstrap 组件之按钮（二）

    Bootstrap是Twitter推出的一个用于前端开发的开源工具包.它由Twitter的设计师Mark Otto和Jacob Thornton合作开发,是一个CSS/HTML框架. 按钮组 .btn-group>.btn : 一组.btn按钮包裹在.btn-group 外包元素.btn-group {position/display/} 按钮元素.btn <div class="btn-group" role="group"> <butto

  • jsp播放视频文件的方法总结

    本文实例讲述了jsp播放视频文件的方法.分享给大家供大家参考,具体如下: 1.avi格式 代码片断如下: JSP代码: <object id="video" width="400" height="200" border="0" classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA"> <param name="ShowDispl

  • cloudgamer出品ImageZoom 图片放大效果

    一般用于放大查看商品图片,在凡客,京东商城,阿里巴巴等都有类似的效果. 好处是能在原图附近对图片进行局部放大查看,而且可以通过鼠标控制查看的部位. 前一阵子看到sohighthesky的图片放大效果,心血来潮自己也写一个看看. 这个程序有以下特点: 1,支持使用原图放大或新图片设置大图: 2,大图完成载入前使用原图放大代替,减少操作等待时间: 3,支持鼠标滚动缩放大图: 4,可以通过设置显示范围或显示框大小设置显示尺寸: 5,可以设置是否自动隐藏显示框: 6,支持插件形式的扩展来实现更多的功能(

随机推荐