jQuery Mobileフォーム入力要素

8061 ワード

1、jQuery Mobileテキスト入力
入力フィールドは標準的なHTML要素で作成され、jQuery Mobileはモバイルデバイス専用の美しく使いやすいスタイルを設定します.また、新しいHTML 5タイプを使用することもできます.
<!doctype html>

<html>

<head>

<meta charset="utf-8">

<meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no" name="viewport" id="viewport" />

<title>     </title>

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css">

<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>

<script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>

</head>

<body>

<style type="text/css">

    .ppp{ padding-left:20px; }

</style>

<div data-role="page" id="pageone">

    <div data-role="content">

        <form method="post" action="#">

            <div data-role="fieldcontain">

                <label for="fname"></label>

                <input type="text" name="fname" id="fname"/>

                <label for="body"></label>

                <input type="date" name="body" id="body" />

                <label for="email"></label>

                <input type="email" name="email" id="email" placeholder="      ..">

            </div>

        </form>

    </div>

</div>

</body>

</html>