<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<title>表單文件域跟圖像域-制用用戶信息註冊頁面</title>
<link href="css/style.css" type="text/css" rel="stylesheet"/>
</head>
<body>
<div id="mr-bg">
<h2>用戶信息註冊</h2>
<form action="index.html" method="get" name="regist" enctype="application/x-www-form-urlencoded" target="_self">
<div class="mr-box">
<label><input type="file"/></label>
<label><input type="image" src="images/btn.jpg"/></label>
</div>
</form>
</div>
</body>
</html>
@charset "utf-8";
/**css document*/
* { /*通配選擇器，清除所有標籤默認樣式*/
padding: 0;
margin: 0;
}
#mr-bg { /*id選擇器，設置整體背景樣式*/
width: 800px;
height: 600px;
margin: 20px auto;
border: 1px solid rgb(255, 0, 0);
background: url("../images/bg.png");
}
h2 { /*標籤選擇器，設置標題樣式*/
margin: 60px 0 20px;
text-align: center;
}
.mr-box { /*類選擇器，設置用戶註冊內容樣式*/
width: 554px;
height: 462px;
margin-left: 150px;
background: url("../images/4-9.png");
position: relative;
}
.mr-box [type="file"] { /*屬性選擇器，設置文件上傳控件位置*/
padding-left: 175px;
margin-top: 100px;
}
[type="image"] { /*屬選擇器，設置圖像域上傳控件位置*/
position: absolute;
top: 427px;
left: 282px;
}
![]()
![]()
![]()
