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

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

11
スパンのCSS固定幅
順不同リスト内: <li><span></span> The lazy dog.</li> <li><span>AND</span> The lazy cat.</li> <li><span>OR</span> The active goldfish.</li> クラスまたはスタイル属性の追加は許可されていますが、テキストのパディングおよびタグの追加または変更は許可されていません。 ページはCourier Newでレンダリングしています。 目標は、スパンを揃えた後にテキストを配置することです。 The lazy dog. AND The lazy cat. OR The active goldfish. 「OR」の正当化は重要ではありません。 怠惰な動物のテキストは追加の要素でラップされる場合がありますが、再確認する必要があります。
381 html  css 

7
css3を使用したSVGドロップシャドウ
css3を使用してsvg要素にドロップシャドウを設定することは可能ですか? box-shadow: -5px -5px 5px #888; -webkit-box-shadow: -5px -5px 5px #888; フィルター効果を使用して影を作成することについていくつかの発言を見ました。CSSを単独で使用する例はありますか?以下は、cusorスタイルが正しく適用されているが、影の効果がない実際のコードです。最小限のコードでシャドウ効果を得るのを手伝ってください。 svg .shadow { cursor:crosshair; -moz-box-shadow: -5px -5px 5px #888; -webkit-box-shadow: -5px -5px 5px #888; box-shadow: -5px -5px 5px #888; } <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" baseProfile="full" viewBox="0 0 120 70"> <rect class="shadow" x="10" y="10" width="100" height="50" fill="#c66" /> </svg> …
379 html  css  svg  svg-filters 

9
val()を使用してselectの値を設定すると、jquery changeイベントがトリガーされないのはなぜですか?
change()イベントハンドラーのロジックは、によって値が設定されている場合は実行されval()ませんが、ユーザーがマウスで値を選択した場合は実行されます。どうしてこれなの? <select id="single"> <option>Single</option> <option>Single2</option> </select> <script> $(function() { $(":input#single").change(function() { /* Logic here does not execute when val() is used */ }); }); $("#single").val("Single2"); </script>
377 jquery  html  select  input 

23
HTML5でiPad Miniを検出する
AppleのiPad Miniは、私たちが望む以上に、iPad 2の小さなクローンです。JavaScriptでは、window.navigatorオブジェクトはMiniとiPad 2で同じ値を公開します。違いを検出するためのこれまでの私のテストでは成功していません。 何でこれが大切ですか? iPad MiniとiPad 2の画面はピクセルは同じですが、実際のサイズ(インチ/センチメートル)が異なるため、PPI(ピクセル/インチ)も異なります。 ウェブアプリケーションやゲームで使いやすいユーザーインターフェースを提供するには、特定の要素のサイズをユーザーの親指や指の位置に応じて調整するため、特定の画像やボタンを拡大して、ユーザーエクスペリエンスを向上させることができます。 私がこれまでに試したこと(いくつかのかなり明白なアプローチを含む): window.devicepixelratio CSS要素の幅(cm単位) CSSメディアクエリ(resolutionおよびなど-webkit-device-pixel-ratio) 同様の単位のSVG図面 すべての種類のCSS Webkit変換を設定された時間実行し、レンダリングされたフレームをカウントしますrequestAnimFrame(測定可能な違いを検出することを望んでいました) 私はアイデアが新鮮です。あなたはどう? アップデート これまでの回答に感謝します。iPad miniと2の検出に反対する人々にコメントしたいと思います。Appleはええと、それらすべてを支配する1つのガイドラインがあるからです。さて、ここでは、人がiPad miniまたは2のどちらを使用しているかを知ることが世界中で本当に理にかなっていると思う理由を説明します。そして、私の推論を好きなようにしてください。 iPad miniは非常に小さいデバイス(9.7インチ対7.9インチ)であるだけでなく、そのフォームファクターによってさまざまな使用法が可能になります。iPad 2は、チャックノリスでない限り、ゲームをするときは通常両手で持ちます。miniは小さくなりますが、軽量であり、片手で握り、別の手でスワイプやタップなどの操作を行うことができます。私自身、ゲームデザイナーおよび開発者として、それがミニかどうかを知りたいので、必要に応じて(たとえば、プレーヤーのグループでのA / Bテストの後に)プレーヤーに別のコントロールスキームを提供することを選択できます。 どうして?まあ、それはほとんどのユーザーがデフォルト設定で行く傾向があるので、プレーヤーがロードしたときに仮想サムスティックを省き、他のタップベースのコントロールを画面に配置することです(ここでは任意の例を示します)。初めてのゲームは、私、そしておそらく他のゲームデザイナーができることを望んでいることです。 だから私見これは細い指/ガイドラインの議論を超えて、Appleと他のすべてのベンダーがやるべきことです:ガイドラインに従うのではなく、私たちがあなたのデバイスを一意に識別し、異なることを考えられるようにします。
376 javascript  html  ipad  svg 



12
CSSでpxまたはrem値の単位を使用する必要がありますか?[閉まっている]
休業。この質問は意見に基づいています。現在、回答を受け付けていません。 この質問を改善してみませんか?この投稿を編集して、事実と引用で回答できるように質問を更新してください。 2か月前に閉鎖。 新しいWebサイトを設計していますが、できる限り多くのブラウザーおよびブラウザー設定と互換性があるようにしたいと考えています。フォントと要素のサイズに使用する測定単位を決定しようとしていますが、決定的な答えを見つけることができません。 私の質問は:私のCSS を使用するpx必要remがありますか? これまでのところ、使用pxはブラウザで基本フォントサイズを調整するユーザーと互換性がないことを知っています。 sはカスケードするので、s emと比較して、remsは維持するのが面倒なので、無視しました。 remsは解像度に依存しないため、より望ましいと言う人もいます。しかし、最新のブラウザのほとんどがすべての要素を均等にズームするため、使用にpx問題はないという人もいます。 CSSで最も望ましい距離の尺度は何であるかについてさまざまな意見があり、どちらが最適であるかわかりません。

8
フレックスボックスで要素を下に揃えます
私にはdiv何人かの子供がいます: <div class="content"> <h1>heading 1</h1> <h2>heading 2</h2> <p>Some more or less text</p> <a href="/" class="button">Click me</a> </div> 次のレイアウトが必要です: ------------------- |heading 1 | |heading 2 | |paragraph text | |can have many | |rows | | | | | | | |link-button | ------------------- テキストの量に関係なく、フローから取り出さずに常に下部pに貼り付けたいです.button。これはFlexboxで達成できると聞いていますが、機能させることができません。
375 html  css  flexbox 

11
iPhone / Safari入力要素の丸めをオフにする
私のウェブサイトはiPhone / Safariブラウザで適切にレンダリングされますが、1つの例外があります。私のテキスト入力フィールドは奇妙な丸みを帯びたスタイルで、私のウェブサイトの他の部分とは見栄えがよくありません。 Safariに(CSSまたはメタデータを介して)入力フィールドを丸めず、意図したとおりに長方形にしないように指示する方法はありますか?


18
jQuery removeClassワイルドカード
たとえば、一致するすべてのクラスを削除する簡単な方法はありますか? color-* だから私が要素を持っているなら: <div id="hello" class="color-red color-brown foo bar"></div> 取り外した後、 <div id="hello" class="foo bar"></div> ありがとう!
370 jquery  html 

13
2つのdivを隣同士に配置する方法は?
次のコードを考えてみましょう: #wrapper { width: 500px; border: 1px solid black; } #first { width: 300px; border: 1px solid red; } #second { border: 1px solid green; } <div id="wrapper"> <div id="first">Stack Overflow is for professional and enthusiast programmers, people who write code because they love it.</div> <div id="second">When you post a …
370 css  html 

7
フォームを送信しないHTMLボタン
フォームがあります。そのフォームの外に、ボタンがあります。次のようなシンプルなボタン: <button>My Button</button> それにもかかわらず、それをクリックすると、フォームが送信されます。コードは次のとおりです。 <form id="myform"> <input /> </form> <button>My Button</button> このボタンで実行する必要があるのはJavaScriptです。しかし、上記のコードのように見えても、フォームを送信します。タグボタンをスパンに変更すると、完全に機能します。しかし、残念ながら、それはボタンである必要があります。そのボタンがフォームを送信しないようにブロックする方法はありますか?例えば <button onclick="document.getElementById('myform').doNotSubmit();">My Button</button>
370 javascript  html 

3
ui-routerでui-srefを使用してパラメーターをコントローラーに渡す方法
ui-srefui-routerの使用に遷移する状態に2つのパラメーターを渡して受け取る必要があります。 以下のリンクを使用して、状態をhomewith fooおよびbarパラメータに遷移するようなもの: <a ui-sref="home({foo: 'fooVal', bar: 'barVal'})">Go to home state with foo and bar parameters </a> コントローラーでの受信fooとbar値: app.controller('SomeController', function($scope, $stateParam) { //.. var foo = $stateParam.foo; //getting fooVal var bar = $stateParam.bar; //getting barVal //.. }); 私が得るundefinedために$stateParam、コントローラに。 誰かが私にそれを成し遂げる方法を理解するのを手伝ってくれませんか? 編集: .state('home', { url: '/', views: { '': { templateUrl: 'home.html', …

2
Flexboxが要素に等しい幅を与えない
最大5アイテム、最小3アイテムのフレックスボックスナビゲーションを試みますが、すべての要素間で幅を均等に分割していません。 フィドル 私がこれからモデリングしているチュートリアルはhttp://www.sitepoint.com/sensitive-fluid-width-variable-item-navigation-css/です。 SASS * { font-size: 16px; } .tabs { max-width: 1010px; width: 100%; height: 5rem; border-bottom: solid 1px grey; margin: 0 0 0 6.5rem; display: table; table-layout: fixed; } .tabs ul { margin: 0; display: flex; flex-direction: row; } .tabs ul li { flex-grow: 1; list-style: none; text-align: …
368 html  css  flexbox 

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