1

以下のonsenuiで書いたloginページですが、CSSとJSを読み込みません。
どうしたら良いかと悩んでいます。

<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link href="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.2.2/build/css/onsenui.css" rel="stylesheet"/>
    <link href="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.2.2/build/css/onsen-css-components.css" rel="stylesheet"/>
    <script src="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.2.2/build/js/angular/angular.min.js"></script>
    <script src="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.2.2/build/js/onsenui.min.js"></script>

    <script>
      ons.bootstrap();
    </script>
  </head>
  <body>
    <ons-page>
            <ons-toolbar var="headbar">
                <div class="center">Log In</div>
                <div class="right"><ons-toolbar-button>Close</ons-toolbar-button></div>
            </ons-toolbar>

            <div class="login-form">
                <input type="email" class="text-input--underbar" placeholder="Email" value="">
                <input type="password" class="text-input--underbar" placeholder="Password" value="">
                <br><br>
                <ons-button modifier="large" class="login-button">Log In</ons-button>
                <br><br>
                <ons-button modifier="quiet" class="forgot-password">Forgot password?</ons-button>
            </div>
    </ons-page>

  </body>
</html>
4
  • 1
    jsfiddleでは記載されているCSSとJSが読み込まれましたが、「読み込まれない」というのは何かで確認したのか、推測なのかどちらでしょうか。また「ちゃんとしたUIが動かない」とありますが、どういう動きを期待しているのですか?
    – unarist
    Commented 2015年4月4日 5:59
  • ja.onsen.io/pattern-login.html のイメージに作りたいのです。 ただし、サンプルのcssとscriptが内蔵Libraryを参照しているため、CDNをリンクしてます。
    – user5886
    Commented 2015年4月4日 6:25
  • そのサンプルには login.css というCSSが載っていますが、それが不足しているためにレイアウトが崩れているのではないでしょうか?
    – unarist
    Commented 2015年4月4日 9:06
  • すいません、そのとおりでした。
    – user5886
    Commented 2015年4月4日 10:07

1 件の回答 1

0

分割CSSの読み込ませ間違いでした。すいませんでした。

この質問に回答するには、ログインする必要があります。