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

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

4
jqueryを使用して各入力値で動的にJSONを作成する
PHPを介してJSON形式からデータを読み取りたいという状況が発生しましたが、JSON形式を動的に作成するためにJavascriptオブジェクトを構築する方法を理解するのに問題があります。 私のシナリオは次のとおりです。 <input title="QA" type="text" class="email"> <input title="PROD" type="text" class="email"> <input title="DEV" type="text" class="email"> これまでのJavascriptコードは、各入力でデータを取得しますが、これからの処理方法を理解できません。 var taskArray = {}; $("input[class=email]").each(function() { var id = $(this).attr("title"); var email = $(this).val(); //how to create JSON? }); 可能であれば、次の出力を取得したいと思います。 [{title: QA, email: 'a@a.com'}, {title: PROD, email: 'b@b.com'},{title: DEV, email: 'c@c.com'}] 電子メールが入力フィールド値によって取得される場所。
91 javascript  jquery  html  json 
3
フレックス/グリッドレイアウトがボタンまたはフィールドセット要素で機能しない
<button>-tagの内部要素をflexboxので中央に配置しようとしていjustify-content: centerます。しかし、Safariはそれらを中央に配置しません。他のタグにも同じスタイルを適用でき、意図したとおりに機能します（<p>-tagを参照）。ボタンだけが左揃えになります。 FirefoxまたはChromeを試してみると、違いがわかります。 上書きしなければならないユーザーエージェントスタイルはありますか？または、この問題に対する他の解決策はありますか？ div { display: flex; flex-direction: column; width: 100%; } button, p { display: flex; flex-direction: row; justify-content: center; } <div> <button> <span>Test</span> <span>Test</span> </button> <p> <span>Test</span> <span>Test</span> </p> </div> コードスニペットを実行するHide resultsスニペットを展開 そしてjsfiddle：http：//jsfiddle.net/z3sfwtn2/2/
91 html  css  safari  flexbox  css-grid 
2
replaceState（）とpushState（）
私はreplaceState()＆の間の長所/短所を読んで探してきましたpushState()。Mozillaの記事も読んでください。この興味深いテストですが、違いはまだわかりません。 それらが何が違うのか説明したい人はいますか？
91 javascript  html 
18
ブートストラップモーダルの問題-スクロールが無効になります
私はモーダルを持っており、そのモーダル内に、機能している大きな非表示のコンテンツを表示するドロップダウンがあります。 これで、最初のモーダルの上に積み重ねられた次のモーダルを開いて閉じると、下のモーダルのスクロールが無効になります。 直面している問題を再現する手順を含む、完全な例を作成しました。あなたはそれをここで見ることができます。 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet"> <title></title> <style> </style> </head> <body> <input type="button" data-toggle="modal" data-target="#modal_1" class="btn btn-lg btn-primary" value="Open Modal 1" > <div class="modal fade" id="modal_1"> <div class="modal-dialog modal-sm"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button> <h4 class="modal-title">First Modal</h4> …
8
cssの背景画像に相当するsrcsetはありますか
imgsrcset属性付きは、レスポンシブ画像を作成するための優れた方法のように見えます。cssbackground-imageプロパティで機能する同等の構文はありますか？ HTML <img src="small.jpg" srcset="medium.jpg 1000w, large.jpg 2000w" alt="yah"> CSS .mycontainer { background: url(?something goes here?); }
9
PDFビューアをページに埋め込む方法は？
私が間違っていない場合、Google Docsは、を介してWebページと同じサーバーに保存されているPDFを表示する手段を提供します<iframe>が、クロスブラウザーに準拠した方法でこれを行う方法を知る必要があります。
91 html  pdf 
2
順序付きリスト番号のスタイルを設定できますか？
順序付きリストの番号のスタイルを設定しようとしています。背景色、境界線の半径、色を追加して、作業中のデザインと一致させたいと思います。 それは不可能だと思います。番号ごとに異なる画像を使用する必要があります。 ol li:first-child {list-style-image:url('1.gif')}; ol li:nth-child(2) {list-style-image:url('2.gif');} etc... より簡単な解決策はありますか？
91 html  css  html-lists  sprite 
7
HTML5フェッチAPIを使用してAccess-Control-Allow-Originヘッダーを許可する
HTML5フェッチAPIを使用しています。 var request = new Request('https://davidwalsh.name/demo/arsenal.json'); fetch(request).then(function(response) { // Convert to JSON return response.json(); }).then(function(j) { // Yay, `j` is a JavaScript object console.log(JSON.stringify(j)); }).catch(function(error) { console.log('Request failed', error) }); 通常のjsonを使用できますが、上記のapiURLのデータをフェッチできません。エラーをスローします： FetchAPIはhttps://davidwalsh.name/demo/arsenal.jsonを読み込めません。要求されたリソースに「Access-Control-Allow-Origin」ヘッダーがありません。したがって、オリジン ' http：// localhost 'はアクセスを許可されていません。不透明な応答がニーズに対応する場合は、リクエストのモードを「no-cors」に設定して、CORSを無効にしてリソースをフェッチします。
91 html  api  url  fetch-api 
4
JavaScriptキャンバスライブラリの現状は？[閉まっている]
休業。この質問には、より焦点を当てる必要があります。現在、回答を受け付けていません。 この質問を改善してみませんか？質問を更新して、この投稿を編集するだけで1つの問題に焦点を当てます。 7年前休業。 この質問を改善する 私はHTMLキャンバスライブラリの研究をしていて、この質問に出くわしました。HTMLキャンバスJavaScriptライブラリおよびフレームワークの現在の最新技術は何ですか？それは2010年に尋ねられました。トップの答えは、Fabric.jsでした。もう少し調査を行った後、http： //www.html5canvastutorials.com/に出会いました。速度を上げるために複数のキャンバスを持つことを誇るKineticJsのチュートリアルが特徴です。後でさらに調査を行った結果、速度と機能に関してはCanvasライブラリがいたるところにあるようです。今日のJavaScript Canvasライブラリとフレームワークの現状はどうなっていますか？一番上に出てきましたか？ 編集：ライブラリは常に変化しており、新しいライブラリに関するニュースや情報を求めて最近多くの人々がここに来ているので、質問をよりタイムレスに変更しました。
11
Googleの画像なしボタン
最近、Googleの新しいイメージレスボタンに関する記事がいくつかあります。 http://stopdesign.com/archive/2009/02/04/recreating-the-button.html http://stopdesign.com/eg/buttons/3.0/code.html http://stopdesign.com/eg/buttons/3.1/code.html http://gmailblog.blogspot.com/2009/02/new-ways-to-label-with-move-to-and-auto.html これらの新しいボタンがGmailでどのように機能するかが本当に気に入っています。サイトでこれらのボタンまたは同様のボタンを使用するにはどうすればよいですか？同様のルックアンドフィールのオープンソースプロジェクトはありますか？ JQuery / XHTML / CSSを使用してこのような独自のボタンパッケージをロールしたい場合、どの要素を使用できますか？私の最初の考えは： <input type="button">外観を改善するためのcssを使用した標準（主にcss / imgesについて話されている設計記事に関連しています。） <a>タグ付きの「onclick」イベントのボタンをルートとするカスタムダイアログとフィルタリング用の検索バーを表示するJQuery JavaScript そのポップアップのテーブルレイアウトは正気でしょうか？ 私はWebのリバースエンジニアリングにひどいですが、これらのボタンをリバースエンジニアリングするために使用できるツールにはどのようなものがありますか？FirefoxのWeb開発者ツールバーを使用すると、ボタンのポップアップダイアログで使用されているcssまたはjavascript（縮小されていても）が実際には表示されません。それらをのぞいていくつかのアイデアを得るには、どのブラウザツールまたは他の方法を使用できますか？ 私はGoogleのIPを盗むつもりはありません。同様のボタン機能を作成する方法を知ってください。
10
canvas.toDataURL（）がセキュリティ例外をスローするのはなぜですか？
十分な睡眠が取れなかったのですか？この次のコード var frame=document.getElementById("viewer"); frame.width=100; frame.height=100; var ctx=frame.getContext("2d"); var img=new Image(); img.src="http://www.ansearch.com/images/interface/item/small/image.png" img.onload=function() { // draw image ctx.drawImage(img, 0, 0) // Here's where the error happens: window.open(frame.toDataURL("image/png")); } このエラーをスローしています： SECURITY_ERR: DOM Exception 18 これがうまくいかないはずはありません！誰かがこれを説明できますか？
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.