• 締切済み

CSSでinputのtypeの設定

閲覧ありがとうございます。 CSS・htmlにまったく知識がありません。 CSSで以下のような例は機能しますか？ input { type: number; } 現在、htmlでinputのtypeを変更したいのですが、 その方法がCSSファイルの読み込みだけなので例の記述をしたファイルを用意したのですが、まったく機能せず。 もとのhtmlにtype属性の指定がすでにされているのですがそれが問題なのでしょうか？ その場合CSSには!importantを記述すればクリアできますか？ よろしくお願い致します。

  • HTML
  • 回答数3
  • ありがとう数6

みんなの回答

  • sanzero
  • ベストアンサー率56% (58/102)
回答No.3

>iOSやandoroidでフォーム入力時に表示されるキーボードを数字のみや英字キーボードに指定できるかなと思ったのですが無理なんですね。 CSSでなくinput type="tel"や"url"である程度対応できます。 使えなくもないですが、完璧に対応できているわけではありません。 実機をみながら確認してみてください。 http://html-five.jp/26/ http://dev.classmethod.jp/ria/html5/mobile-html5-form/

  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.2

＞iOSやandoroidでフォーム入力時に表示されるキーボードを数字のみや英字キーボードに指定できるかなと思ったのですが無理なんですね。 　それはできます。属性セレクタを使用します。 form[action="なんたらかんたら"] input[name="a"]{overflow:hidden;text-indexnt:1em;position:relative;} form[action="なんたらかんたら"] input[name="a"]:after{content:"あ";position:absolute;top:0;left:0;} とかね。 5 セレクタ( http://momdo.s35.xrea.com/web-html-test/spec/CSS21/selector.html ) 6 プロパティ値とカスケーディング、継承の割り当て( http://momdo.s35.xrea.com/web-html-test/spec/CSS21/cascade.html ) 10 視覚整形モデル詳細( http://momdo.s35.xrea.com/web-html-test/spec/CSS21/visudet.html ) 　でも入力される値は変更はできません。あを押してもaが入力される。

  • hitomura
  • ベストアンサー率48% (325/664)
回答No.1

CSS で設定できるのはスタイルだけです。HTML タグの属性の style='○○' となっている○○の部分だけです。 一方、input の type 属性は style 属性とは別の属性です。 style='○○' の外側にある事項です。 したがって、CSS で input の type を修正することはできません。

adictionnn
質問者

お礼

回答ありがとうございます。 スタイルだけなんですね。。。iOSやandoroidでフォーム入力時に表示されるキーボードを数字のみや英字キーボードに指定できるかなと思ったのですが無理なんですね。

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. HTML

関連するQ&A

  • input type="file"の幅と高さ

    FireFox12で、ファイルを取り扱うフォーム部品のボックスの高さと幅が変更できません。 type属性がtextboxだとFireFoxでもCSSがちゃんと適用されます。 <input type="file" name="sample" class="test" /> .photo { width:580px; height:20px; } としていますが、IE8/9 Safari5.1.7/Chrom19では指定した幅と高さになるのですが FireFoxだけ変化しません。 どうしようもないのでしょうか？

    • ベストアンサー
    • CSS
  • [IE5.5]INPUT TYPE=FILEのREADONLYについて

    先週まで、IE5.0でHTMLを書いておりました。 今週なんとなくIE5.5 SP2にバージョンアップしました。 そしたら、以下の部分が動作しなくなってしまいました。 ----------------------------------- <INPUT TYPE="FILE" READONLY="true"> ----------------------------------- 前任者が作成したソースですので、記述に誤りがあるかもしれませんが、 IE4.0、IE5.0では何も問題なく動作しております。 しかしIE5.5だと、ファイル参照のボタンは表示されているのですが、 クリックしても何の反応もありません。 ちなみにREADONLY属性を取り除くと、ファイル選択ダイアログが表示されました。 しかし、ファイルを選択した後サーバへアップロードしており、 アップロードされたファイル名をデータベースに書き込む処理がありますので、 万が一、アップロード後にファイル名が書き換えられてしまうと、 サーバとデータベースとの整合が取れなくなってしまう為、 どうしても編集不可にしたいのです。 どなたかご存知の方が見えましたらご教授願います。 IE5.5では、<INPUT TYPE="FILE">にREADONLY属性は使えないのでしょうか？ また、別の方法での対処方法などはないでしょうか？

  • input type="submit"が押せない

    インプットタグで作ったボタンが押せなくなる原因を知りたいです。 今回の状況はwordpressの管理画面のボタンなんですが、 バージョンアップをしたらsubmitボタンが無効になる現象がおきました。 おそらくhtmlかcss、javascriptが関係していると思うのですが ファイルが膨大なのでそもそもの原因を知りたく投稿させていただきました。 html,css,javascript関連でinput type="submit"が押せなくなって 解決方法をご存知の方いらっしゃいましたらご教授願います。

  • input typeでボタンが出現しません

    inputで記述してもボタンが出ないです。何がおかしいのでしょうか？ <div class="register"を削除したら出たのですが、書き方が変ですか？ その部分のコードは以下の通りです。 HTML側 <div class="register" <input type="submit" name="registering" value="会員登録（無料)"></div> CSS側 .register{ height:60px; }

    • ベストアンサー
    • HTML
  • 特定の<input >タグ及び<label>タグの部分をCSSで非表示にしたい。

    下記コードの<input >タグ及び<label>タグの部分をCSSで非表示にしたいのですが、 <div class="image-size-item"> <input id="image-size-thumbnail-142" type="radio" value="thumbnail" name="attachments[142][image-size]"/> <label for="image-size-thumbnail-142">サムネイル</label> <label class="help" for="image-size-thumbnail-142">(96 × 96)</label> </div> 問題はimage-size-thumbnail-142の最後の番号及び桁数が出力ごとに変化します（例：image-size-thumbnail-154、image-size-thumbnail-2223等）。このような場合、CSSはどのように記述すればよいのでしょうか？ CSSは、システムの関係上、同ページのヘッダー内に記述する必要があり、タグ内に直接記述することはできません。 以下のようなCSSコードを<head>内に記述しましたが、 <style type="text/css"> [id~="image-size-thumbnail"] { display: none; } [for~="image-size-thumbnail"] { display: none; } </style> 上記コードの<input >タグ及び<label>タグの部分を非表示にすることができません。どこが間違っているかご指摘いただけると幸いです。また、もっと良い方法があれば、教えてください。 なお、同ページには他の部分において<input >タグ及び<label>タグが使用されている箇所が複数ありますので、<input >タグ及び<label>タグ部分を全て表示にするというCSSの記述は使用できません。 参考サイト等ありましたら、教えて下さい。 よろしくお願いします。

  • <input type="file">アップロード

    下記教えて下さい <input type="file" name="datafile"> <input type="submit" value="送信する"> 上記を使ってファイルのアップロード機能を作りたいのですが、 (1)ファイル選択していない状態で「選択されていません」となるので 　文字を消したい（文字を非表示、または違う文言にしたい）場合、どこで設定するのでしょうか。 (2)送信するボタンを置かずに、選択時にそのまま送信処理につなげたいのですが 　どのようにすれば良いでしょうか。

    • ベストアンサー
    • HTML
  • CSSの変わった記述方法の意味を教えてください。

    先日、CSSの記述方法で以下の書き方を見つけました。 input[type=checkbox] { 何とかかんとか… 何とかかんとか… } この[] で囲まれた部分の記述方法ですが、これはどういった意味でしょうか？ 何となく、inputのtypeはcheckboxなので、checkboxのみに有効に見たいな感じだと思うのですが…。 具体的に[] で囲む場合の使い方を教えていただけないでしょうか。 よろしくお願いします。

    • ベストアンサー
    • CSS
  • CSSについて

    どうもこんばんわ 現在CSSについて勉強中です 色々なサイトへ行ってCSSを眺めてるんですが <link rel="stylesheet" type="text/css" href="sample.css" media="all" /> こうゆうHTMLファイルのヘッダーに記述されていないCSSは見れないんでしょうか？ よろしくお願いします～＾0＾

    • ベストアンサー
    • CSS
  • input type=submitボタンを別ウィンドウで立ち上げたい！

    アンケートフォームに、 print "<input type=submit value=\"結果を見る\">"; と記述してある部分があるのですが、このボタンをクリックした後の結果ページを別ウィンドウで立ち上げたいのです。 このボタンに別ウィンドウで立ち上げる属性をプラスするのか、ボタンクリック後のソース部分にプラスするのかわかりませんが、とりあえず、 print "<input type=submit value=\"結果を見る\" onClick=\"window.open()\">"; で試してみたところ、別のウィンドウが立ち上がるものの、結果表示が元のウィンドウに表示されてしまいます。 どうやって結果ページを別ウィンドウにできるか、どなたか教えてください。

    • 締切済み
    • CGI
  • [CSS]floatを使う理由

    CSSの初心者です。 http://yoppa.org/taumedia10/1695.html　というページに例として挙げられているスタイルシートで、 以下の記述があります。 nav { float:right; width:236px; } section { float:right; width:620px;} footer {clear:both !important; text-align: center;} ここでSectionをfloatさせる理由は何でしょうか？F loatさせなれければ、わざわざClearを使う必要もないし、以下のように記述したほうが簡単だと思います。 nav { float:right; width:236px; } section {width:620px;} よろしくお願いします。 footer {text-align: center;}

    • ベストアンサー
    • CSS

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する