HTML5(21)

21follower
かしこ さんのアバター 19views

ドロップダウンメニューを作りたかった

よくあるドロップダウンメニューを作りたくて、いろいろ参考にさせていただきながら作業 ■ html <ul id="main_menu_list"> <li class="large_menu">メニュー1... 2016年9月5日
かしこ さんのアバター 22views

htmlひな形

個人的メモ htmlひな形 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <met... 2016年9月2日
kentomurata さんのアバター 62views

Safariはdatalistには未対応

datalistを使うと、入力フォームで入力候補を表示することができます。 これはHTML5から新しく導入されたもので、Chromeでは表示できるもののSafariでは表示できないので注意が必要です。 ただ、以下のように書けば未対応のブ... 2016年8月18日
harada さんのアバター 73views

指定したテキスト入力フォームにdatalistを追加して選択もできるようにする

WordPressのカスタムフィールドテンプレートを利用しているフォームタグの場合は以下のように記述します。 var parkinglist = '<datalist id="othercharge">'; parkingli... 2016年3月11日
harada さんのアバター 110views

【カスタムフィールドテンプレート】入力できる文字数を制限する

カスタムフィールドテンプレートを利用した入力項目で、文字数を制限したい場合一番簡単な方法はmaxlength属性を利用することです。 ダッシュボード>設定>カスタムフィールドテンプレート の「テンプレートコンテンツ」で、例えば以下のように... 2016年2月22日
harada さんのアバター 126views

Chromeでdatalistを利用するとhoverで表示される三角を非表示にする

‘datalist’タグを利用してテキスト入力フォームに入力候補を表示する際に、Firefoxはいいのですが、Chromeでどうしても三角アイコンが表示されるという現象を確認しました。 selectと同じようにap... 2016年1月27日
YY3ai2ui24 さんのアバター 66views

inputタグの入力欄に候補をだす

<input>タグにlist属性と<datalist>タグを使うと簡単に入力候補を実装できます。 また、<datalist>内部の<option>の中になにか文字を入れると、サブテキストが表... 2016年1月20日
nbeppu さんのアバター 910views

Electronで簡単にWebアプリをデスクトップアプリ化する

Electronは、HTML5/JavaScript で簡単にクロスプラットフォームのデスクトップアプリケーションを作成することができるツールです。 webview での表示もできますので、これを利用して簡単にWebアプリをデスクトップアプ... 2015年10月22日
harada さんのアバター 63views

HTML5:ダウンロードリンクを置く

HTML5ならdownload属性でダウンロードリンクも簡単なんですね! ダウンロードリンクはリンクを押すとダウンロードさせることができるリンクです。 記述方法 リンクしているURLとダウンロードURLが同じ場合などは省略もできるようで... 2015年7月17日
sakukazu さんのアバター 182views

iframe内で定義したメソッドを外のhtmlから呼び出す

< iframe id=hogeframe >内で以下のメソッドを定義したとします。 hogehoge = function (){ ~ }; 外部のhtmlからは以下でメソッドを使用できます。 document.getEl... 2015年3月13日
nbeppu さんのアバター 187views

JavaScript ライブラリを使わずに placeholder を実装する

HTML5 の placeholder 非対応ブラウザでも簡単に placeholder を実装する方法。jQuery などのライブラリは利用していません。 JavaScript function onFocusPlaceholder(... 2014年11月7日
Yukimi Sato さんのアバター 359views

IEでHTML5やCSS3を有効にできるレンダリングモード

<meta http-equiv="X-UA-Compatible" content="IE=Edge, chrome=1"> IE=Edge:最新のモードを利用する chrome=1:「Chrome Frame for I... 2014年8月27日
Yukimi Sato さんのアバター 387views

HTML5でのstrongタグは「太字」表現ではなく「強調」したい時に使おう

<p><b>太字になります</b></p> <p><strong>太字になります</strong></p> どちらも同じように表示されますが... 2014年8月18日
Yukimi Sato さんのアバター 4,160views

HTML5でコピーライト表記をする時は「small」タグを使おう

HTML5のバリデータチェック時に覚えておきたいことより <small>コピーライト表記</small> XHTMLではaddressタグを使っていたので、HTML5でもそのまま使っていましたが、正確にはsma... 2014年8月13日
Yukimi Sato さんのアバター 269views

HTML5のinputのバリデートチェックをオフにする

<input type="email" formnovalidate> 「formnovalidate」を追加することでオフにすることができます。 ... 2014年8月11日
Yukimi Sato さんのアバター 260views

placeholderの文字色を変更する

//Chrome input::-webkit-input-placeholder{ color: red; } //FireFox input:-moz-placeholder{ color: red; } //IE input:-m... 2014年8月6日
Yukimi Sato さんのアバター 1,181views

HTML5で追加されたmainタグとroleについて

<main role="main"> ~ メインコンテンツ部分 ~ </main>   HTML5で追加されたmainタグはページ内で一度のみ使用することができます。 同時に「... 2014年5月27日
Yukimi Sato さんのアバター 1,003views

HTML5とCSS3のブラウザ別対応状況がわかるまとめ「HTML5 & CSS3 Support」

HTML5 & CSS3 Support http://fmbip.com/litmus/ CSS3の各セレクタ別に対応状況がまとめられており、特にIE対応の前には一度確認しておきたいページです。 ... 2014年5月16日
Yukimi Sato さんのアバター 340views

HTML5で表記が短縮されたmetaタグ一覧

DOCTYPEの記述 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml... 2014年5月14日
Yukimi Sato さんのアバター 1,106views

HTML5で不要なmetaタグ一覧

css、js用の記述 <meta http-equiv="Content-style-type" content="text/css"> <meta http-equiv=&quo... 2014年5月13日