dojo学习第一天 Tab选项卡 实现(2)


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>第一天 </title>
<meta content="EditPlus">
<meta content="">
<meta content="">
<meta content="">
<style>
@import url(../dijit/themes/tundra/tundra.css);
@import url(../dojo/resources/dojo.css);
</style>
<script src='https://www.jb51.net/dojo/dojo.js' djConfig='parseOnLoad:true'></script>
<script>
dojo.require("dojo.parser");
dojo.require('dijit.layout.ContentPane');
dojo.require('dijit.layout.TabContainer');
</script>
<style>
.myForm{width:600px;height:300px;line-height:1.6;}
.myForm label{width:150px;float:left;}
</style>
</head>

<body>

<div dojoType='dijit.layout.TabContainer'>
<div dojoType='dijit.layout.ContentPane' title='个人信息'>
<label for="firstName">First Name:</label><input type='text' /></br>
<label for="lastName">Last Name:</label><input type='text' /></br>
<label for="middleInitial">Middle Initial:</label><input type='text' /></br>
</div>
<div dojoType='dijit.layout.ContentPane' title='联系地址'>
<label>Email:</label><input type='text' /></br>
<label>Address:</label><input type='text' /></br>
<label>State:</label><input type='text' /></br>
<label>City:</label><input type='text' /></br>
<label>Country:</label><input type='text' /></br>
</div>
<div dojoType='dijit.layout.ContentPane' title='联系电话'>
<label>Work Phone:</label><input type='text' /></br>
<label>Home Phone:</label><input type='text' /></br>
<label>Cell Phone:</label><input type='text' /></br>
</div>
</div>
</body>
</html>

您可能感兴趣的文章:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wdjpds.html