タグ付けされた質問 「html」

HTML(HyperText Markup Language)は、Webブラウザーに表示されるWebページやその他の情報を作成するための主要なマークアップ言語です。HTMLに関する質問には、最小限の再現可能な例と、何を達成しようとしているのかについての考えを含める必要があります。このタグが単独で使用されることはほとんどなく、[CSS]や[javascript]と組み合わせられることがよくあります。

12
margin:autoを使用してdivを垂直方向に揃える
したがって、を使用すると、divを水平方向に中央揃えできることがわかりますmargin:0 auto;。必要がありmargin:auto auto;、私はそれが動作するはずだと思うどのように動作しますか?垂直方向にも中央揃えですか? なぜうまくいかないのvertical-align:middle;ですか? .black { position:absolute; top:0; bottom:0; left:0; right:0; background:rgba(0,0,0,.5); } .message { background:yellow; width:200px; margin:auto auto; padding:10px; } <div class="black"> <div class="message"> This is a popup message. </div> </div> コードスニペットを実行する結果を非表示スニペットを展開 JSFiddle
113 html  css  centering 

5
:focusでtextareaの境界線の色を変更する方法
これは愚かな質問ですが、私には助けが必要です。TEXTAREAの枠線の色を変更したい。しかし、私のコードは正しく機能していないようです。 親切にフィドルでコードを表示します。 <form name = "myform" method = "post" action="insert.php" onsubmit="return validateform()" style="width:40%"> <input type="text" placeholder="Enter Name." name="name" maxlength="300" class="input"> <input type="email" placeholder="Enter E-mail." name="address" maxlength="300" class="input"> <textarea placeholder="Enter Message." name="descrip" class="input" ></textarea> <br> <input class="button secondary" type=submit name="submit" value="Submit" > </form> ここにCSSがあります .input { border:0; padding:10px; font-size:1.3em; font-family:"Ubuntu Light","Ubuntu","Ubuntu …
113 html  css 

12
オーバーフロースクロールでtbodyの高さを設定する方法
tbodyの高さの幅のオーバーフロースクロールの設定中に問題が発生します。 <style> tbody{ height:50px;display:block;overflow:scroll } </style> <h3>Table B</h3> <table style="border: 1px solid red;width:300px;display:block"> <thead> <tr> <td>Name</td> <td>phone</td> </tr> </thead> <tbody style='height:50px;display:block;overflow:scroll'> <tr> <td>AAAA</td> <td>323232</td> </tr> <tr> <td>BBBBB</td> <td>323232</td> </tr> <tr> <td>CCCCC</td> <td>3435656</td> </tr> </tbody> </table> ここに私のフィドルをご覧ください オーバーフロースクロールのあるテーブルAのようなテーブルBが必要です。 どんな助けでもありがたいです。 Mさん、ありがとうございました。
113 html  css 

5
1つのフォームに複数のラジオボタングループ
1つのフォームに複数のラジオボタングループを含めることはできますか?通常、1つのボタンを選択すると前のボタンが選択解除されます。グループの1つを選択解除するだけで済みます。 <form> <fieldset id="group1"> <input type="radio" value=""> <input type="radio" value=""> </fieldset> <fieldset id="group2"> <input type="radio" value=""> <input type="radio" value=""> <input type="radio" value=""> </fieldset> </form>
113 html  forms  radio-group 

2
ファビコン標準-2020-svg、ico、png、および寸法?
2020年現在、どのファビコンディメンション、ファイル形式、メタ/リンクタグを使用する必要がありますか?これには、今日使用されているアップルのアイコン、Windows、Androidなどのデバイスが含まれます。 Operaを使用していますが、svg形式をサポートしていることがわかります。今日、svgを使用するのに最適なソリューションですか?「1つのファイルですべてに対応」というオプションはありますか? 私は多くのウェブサイトを閲覧していて、さまざまな「ファビコンジェネレータ」をチェックしてきました。それらはすべて古いものであり、ほとんどがpngファイルで動作します。 例: icoとsvgにはどのコードを使用する必要がありますか? <link rel="icon" href="favicon.ico" type="image/ico"> <link rel="icon" href="favicon.svg" type="image/svg+xml"> または、icoにさらにサイズが含まれている場合は、寸法を指定する必要がありますか?良い答えは見つかりませんでした。 <link rel="icon" sizes="16x16 24x24 32x32 48x48 64x64" href="favicon.ico"> 使用するファビコンの寸法、ファイル形式、メタ/リンクタグを入力してください。
113 html  svg  png  favicon 

2
フレックスアイテムを右に浮かせる
私は <div class="parent"> <div class="child" style="float:right"> Ignore parent? </div> <div> another child </div> </div> 親は持っています .parent { display: flex; } 私の最初の子供のために、私は単にアイテムを右に浮かせたいです。 そして、私の他のdivは、親によって設定されたフレックスルールに従います。 これは可能ですか? そうでない場合、float: rightアンダーフレックスを行うにはどうすればよいですか?
113 html  css  flexbox 

7
AngularJSディレクティブはAとEを制限します
私は小さなチームで働いており、AngularJSでビルドして、いくつかの基本的な標準とベストプラクティスを維持しようとしています。特に、Angularは比較的新しいです。 私の質問は、ディレクティブに関してです。より正確には、restrictオプション。 私たちの一部はrestrict: 'E'このよう<my-directive></my-directive>にhtml を使用しています。 他の人たちはhtml restrict: 'A'を使用<div my-directive></div>している。 そして、もちろん、restrict: 'EA'上記のいずれかを使用することができます。 現時点では大した問題ではありませんが、このプロジェクトの規模が大きくなると、誰もがそれを見て、何が起こっているのかを簡単に理解してもらいたいと思います。 物事の属性または要素の方法に賛成/反対はありますか? 属性よりもsay要素を選択する場合に知っておくべき落とし穴はありますか?

6
CSSラベルの幅が有効にならない
ラベルと入力フィールドを揃えるためにスタイルを設定したい汎用フォームがあります。何らかの理由でラベルセレクターに幅を指定しても、何も起こりません。 HTML: <form id="report-upload-form" method="POST" action="" enctype="multipart/form-data"> <p> <label for="id_title">Title:</label> <input id="id_title" type="text" class="input-text" name="title"></p> <p> <label for="id_description">Description:</label> <textarea id="id_description" rows="10" cols="40" name="description"></textarea></p> <p> <label for="id_report">Upload Report:</label> <input id="id_report" type="file" class="input-file" name="report"> </p> </form> CSS: #report-upload-form { background-color: #316091; color: #ddeff1; font-weight:bold; margin: 23px auto 0 auto; border-radius:10px; width: 650px; …
112 html  css  label 

2
HTML5入力タイプのdatetimeが、すでにサポートされているブラウザーから削除されるのはなぜですか?
過去に入力をサポートしていたChromeバージョン26などのすべてのブラウザーがなぜdatetimeそれを削除したのかと思っていましたか? これはこの記事の複製のように聞こえますが、かなり古くなっています。 HTML WGはdatetime-local(w3c)よりdatetime(w3c)を好むようですが、なぜですか? 機能開発のタイムラインについては、こちらをご覧ください。 他の人が言うこと: mobilexweb.comによると、「日時入力タイプに非常に似ているため」iOSでは廃止されました。 Google Chromeに続いて、iOSのSafariは日付入力タイプをサポートしなくなり、テキストにフォールバックします。このタイプは、datetime-localを採用するか、同じ目的で日付と時刻の2つの入力を使用するために、標準で非推奨になりました。問題は、datetimeがバージョン5.0から6.1までのiOSと互換性があったことです。使用している場合は注意してください。 違いはなんですか? whereにdatetime-localは日付と時刻の要素のみdatetimeが含まれ、タイムゾーンも含まれます。これは、クライアントのタイムゾーンがサーバーのタイムゾーンと異なる場合に別の方法で動作したい場合があるので便利です。 なぜこれが問題なのですか? Webページで、いつ電話をかけたいのか、ユーザーが「明日午後3時」を選択したのか、いつ電話をかけ直す必要があるのか​​を尋ねられたらどうしますか。明日の午後3時UTCまたはCET?

14
<canvas>要素の最大サイズ
私は、高さcanvas要素で働いている600の1000ピクセルとピクセル数万あるいは数百の幅。ただし、一定数のピクセル(明らかに不明)の後、キャンバスにJSで描画した形状が表示されなくなります。 制限があるかどうか誰か知っていますか? Chrome 12とFirefox 4の両方でテスト済み。
112 javascript  html  canvas 

8
HTML5フォーム検証でドットなしのメールが許可されるのはなぜですか?
HTML5のフォーム検証を示すために、非常に単純なモックアップを作成しています。ただし、メールの検証ではアドレスのドットはチェックされず、ドットに続く文字もチェックされないことに気付きました。 つまり、「john @ doe」は有効なメールアドレスではない場合、有効と見なされます。「doe」はドメインではありません。 これは私が私のメールフィールドをコーディングしている方法です: &lt;input type="email" required /&gt; それで十分ではありませんか? このフィドルをチェックして、私の意味を確認してください。 注:代わりに、RegExパターンを使用してこれを行う方法を知っています。私は誰かが代わりに電子メールの種類を使うことでどうやって逃げることができるのだろうと思っています。

4
jsonデータをhtmlテーブルに変換する[終了]
閉まっている。この質問はスタックオーバーフローのガイドラインを満たしていません。現在、回答を受け付けていません。 この質問を改善してみませんか?Stack Overflowのトピックとなるように質問を更新します。 6年前休業。 この質問を改善する jsonデータを指定して動的テーブルを生成するjQueryまたはJavaScriptライブラリはありますか?列を定義したくないので、ライブラリはjsonハッシュのキーを読み取って列を生成する必要があります。 もちろん、私はjsonデータを繰り返し処理して、htmlテーブルを生成できます。私が再利用できるライブラリが存在するかどうかを知りたいだけです。

5
<svg>要素を親コンテナに拡張または縮小するにはどうすればよいですか?
目標は、&lt;svg&gt;要素がその親コン​​テナのサイズに拡張さ&lt;div&gt;れることです。この場合は、コンテナの大きさに関係なく、です。 コード: &lt;style&gt; svg, #container{ height: 100%; width: 100%; } &lt;/style&gt; &lt;div id="container"&gt; &lt;svg xmlns="http://www.w3.org/2000/svg" version="1.1" &gt; &lt;rect x="0" y="0" width="100" height="100" /&gt; &lt;/svg&gt; &lt;/div&gt; この問題の最も一般的な解決策viewBoxは、&lt;svg&gt;要素の属性を設定することです。 viewBox="0 0 widthOfContainer heightOfContainer" ただし、これは、要素内の&lt;svg&gt;要素に事前定義された幅や高さがある場合は機能しないようです。たとえば&lt;rect&gt;、上のコードの要素には、幅と高さが明示的に設定されています。 したがって、明らかな解決策は、これらの要素にも幅と高さを使用することです。しかし、これは実行する必要があるのでしょうか?特に、高さや幅&lt;img src=test.svg &gt;を明示的に設定しても問題なく機能し、問題なく拡張/縮小し&lt;rect&gt;ます。 のような要素&lt;rect&gt;とそのような他の要素の幅と高さをパーセンテージで定義する必要がある場合、Inkscapeでそれを設定して、&lt;svg&gt;ドキュメントのすべての要素が固定サイズの代わりにパーセンテージの幅、高さなどを使用するようにする方法があります。 ?

9
JSONをHTML属性に格納する最良の方法は?
JSONオブジェクトをHTML要素の属性に配置する必要があります。 HTMLは検証する必要はありません。 Quentinによる回答:JSONをdata-*属性に格納します。これは有効なHTML5です。 JSONオブジェクトは任意のサイズ-つまり巨大 森まいくの回答:HTML属性の制限は、潜在的に65536文字です。 JSONに特殊文字が含まれている場合はどうなりますか?例えば {foo: '&lt;"bar/&gt;'} Quentinによる回答:通常の規則に従って、属性に入れる前にJSON文字列をエンコードします。PHPの場合は、関数を使用します。 htmlentities() 編集-PHPとjQueryを使用したソリューションの例 JSONをHTML属性に書き込む: &lt;?php $data = array( '1' =&gt; 'test', 'foo' =&gt; '&lt;"bar/&gt;' ); $json = json_encode($data); ?&gt; &lt;a href="#" data-json="&lt;?php echo htmlentities($json, ENT_QUOTES, 'UTF-8'); ?&gt;"&gt;CLICK ME&lt;/a&gt; jQueryを使用してJSONを取得する: $('a').click(function() { // Read the contents of the attribute (returns a string) var …
112 javascript  php  html  json 

4
CSS Progress Circle [終了]
閉まっている。この質問はスタックオーバーフローのガイドラインを満たしていません。現在、回答を受け付けていません。 この質問を改善してみませんか?Stack Overflowのトピックとなるように質問を更新します。 5年前休業。 この質問を改善する 私はこのWebサイトを検索してプログレスバーを見つけましたが、見つけたものは100%に達するアニメーションサークルを示しています。 下のスクリーンショットのように、特定の割合で停止したいと思います。CSSだけを使用してそれを行う方法はありますか?

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.