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
>
查看全文
相关阅读:
C# DictionaryHelper
C# Autofac 的 BeanFactory
正则替换
java页面表格导出为Excel实现
CentOS 7 下安装Nginx
认识Java 虚拟机的架构
06 查看网卡实时流量
05 找出占用CPU、内存过高的进程
04 一键查看服务器资源利用率
03 批量创建100个用户并设置随机密码
原文地址:https://www.cnblogs.com/ada313/p/1581804.html
最新文章
C#学习笔记之——哈希表(Hash Table)
C#学习笔记之——堆栈,队列和两个栈实现一个队列的算法
toupper函数及一些小程序
有趣的题目
极路由的硬件之路
静待,现实和人生
安卓视频笔记
初学数据结构四
初学数据结构三
初学数据结构二
热门文章
初学数据结构
学生管理系统(C语言)
IOS反射
ios小知识点
Aop之使用Castle动态代理实现对方法的拦截
计算方法执行时间
简单分页计算类
分页类
C# 一些请求的基类(待补充)
Autofac构建
Copyright © 2011-2022 走看看