zoukankan
html css js c++ java
通过CSS控制图片样式,实现图片弹出效果
Code
1
<!
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
>
2
2
<
html
xmlns
="http://www.w3.org/1999/xhtml"
>
3
3
<
head
>
4
4
<
title
>
Untitled Page
</
title
>
5
5
<
style
type
= "text/css"
>
6
6 body
{
}
{}
{
}
{
7
7 margin-top
:
10px
;
8
8 margin-right
:
0
;
9
9 margin-bottom
:
0
;
10
10 margin-left
:
0
;
11
11 padding
:
0
;
12
12
}
13
13 #picture
{
}
{}
{
}
{
14
14 background-color
:
#ffffff
;
15
15 left
:
10px
;
16
16 position
:
relative
;
17
17 top
:
10px
;
18
18 width
:
35px
;
19
19
}
20
20 #picture a .large
{
}
{}
{
}
{
21
21 width
:
1px
;
22
22 display
:
block
;
23
23 left
:
-1px
;
24
24 top
:
-1px
;
25
25 height
:
1px
;
26
26 position
:
absolute
;
27
27 border-width
:
0px
;
28
28
29
29
}
30
30 #picture a img
{
}
{}
{
}
{
31
31 border
:
0px
;
32
32
}
33
33 #picture a.pop,#picture a.pop:visited
{
}
{}
{
}
{
34
34 background
:
#ffffff
;
35
35 border
:
1px solid #000000
;
36
36 display
:
block
;
37
37 height
:
35px
;
38
38 left
:
0
;
39
39 text-decoration
:
none
;
40
40 top
:
0
;
41
41 width
:
35px
;
42
42
}
43
43 #picture a.pop:hover
{
}
{}
{
}
{
44
44 background
:
#8c97a3
;
45
45 color
:
#000000
;
46
46 text-decoration
:
none
;
47
47
}
48
48 #picture a.pop:hover .large
{
}
{}
{
}
{
49
49 border
:
1px solid #000000
;
50
50 display
:
block
;
51
51 height
:
200px
;
52
52 left
:
40px
;
53
53 position
:
absolute
;
54
54 top
:
40px
;
55
55 width
:
200px
;
56
56
}
57
57
</
style
>
58
58
</
head
>
59
59
<
body
>
60
60
61
61
<
div
id
= "picture"
>
62
62
<
a
class
= "pop"
href
= "#"
>
63
63
<
img
src
= "midle.jpg"
width
= "35px"
height
= "35px"
/>
64
64
<
img
src
= "all1.jpg"
width
= "100px"
height
= "100px"
class
= "large"
/>
65
65
</
a
>
66
66
</
div
>
67
67
68
68
</
body
>
69
69
</
html
>
查看全文
相关阅读:
索引唯一性扫描(INDEX UNIQUE SCAN)
索引范围扫描(INDEX RANGE SCAN)
算法设计与分析——回溯法算法模板
操作系统考试复习大纲
windows cmd 生成文件目录树
Java 匿名类和lambda表达式
下载Abook 高等教育出版社网站资料
操作系统——银行家算法(Banker's Algorithm)
算法设计与分析——最大团问题(回溯法)
JVM内存区域
原文地址:https://www.cnblogs.com/ada313/p/1581804.html
最新文章
不同数据源特征及对应的增量数据捕获策略(转)
缓慢变化维解决方案
sql 删除重复记录
PL/SQL Developer连接到Oracle 12c
ODI Studio拓扑结构的创建与配置(Oracle)
Calling a PL/SQL procedure in ODI
oracle中extract()函数----用于截取年、月、日、时、分、秒
缓慢变化维 (Slowly Changing Dimension) 常见的三种类型及原型设计(转)
SCD Type2 in ODI
Microsoft Excel as a Source and Target as Oracle in ODI
热门文章
Installing ODIConsole application using weblogic server
解决ODI 12C Studio 运行缓慢问题
Oracle NET工作原理、配置及连接问题排查
optimizer_mode优化器模式
多表连接的三种方式详解 hash join、merge join、 nested loop
Oracle 执行计划(Explain Plan)
为准确生成执行计划更新统计信息-analyze与dbms_stats
索引跳跃式扫描(INDEX SKIP SCAN)
索引快速扫描(index fast full scan)
索引全扫描(INDEX FULL SCAN)
Copyright © 2011-2022 走看看