自分のホームページやブログを紹介する際に、ただのリンクを貼るだけだとあまり目立ちません。 なので、目立って、かつ覚えてもらいやすい良い方法はないかなと考えていました。 そんな時にふと目に留まったのが、こちら。 「Googleウェブマスターツール」のサイト選択のところなんだが、どうもファビコンを取得して画像を表示しているようです。 こんな感じで、リンクの前にファビコン画像を表示できたら、目立って覚えてもらいやすくて良さそう! ということで、その方法を調べてみました。
自分のホームページやブログを紹介する際に、ただのリンクを貼るだけだとあまり目立ちません。 なので、目立って、かつ覚えてもらいやすい良い方法はないかなと考えていました。 そんな時にふと目に留まったのが、こちら。 「Googleウェブマスターツール」のサイト選択のところなんだが、どうもファビコンを取得して画像を表示しているようです。 こんな感じで、リンクの前にファビコン画像を表示できたら、目立って覚えてもらいやすくて良さそう! ということで、その方法を調べてみました。
YouTube の動画埋め込みをレスポンシブ対応する方法を紹介します。 埋め込みコードをブロック要素で囲み、CSS の aspect-ratio プロパティを使い、アスペクト比を 16:9 に固定することで対応します。縦型動画の場合はアスペクト比を任意の値に変更してください。 また、古いブラウザーでも対応できる padding-top ハックを使った方法も紹介します。 動画の埋め込みをレスポンシブ対応する方法 aspect-ratio を使った方法 padding-top ハックを使った方法 動画の埋め込みをレスポンシブ対応する方法 まずは YouTube からコピーした「動画の埋め込みのコード(iframe)」をブロック要素(<div class="youtube">〜</div>)で囲みます。 <div class="youtube"> <iframe width="560" heig
注意 テンプレートの編集( ソースコード改変 )するときは、必ずバックアップを取ってから編集しましょう。 不安な方は以下の関連記事を参照してください。 【 超初心者向け 】 Blogger のテンプレートを反映・編集する方法 JQuery の導入 JQuery の導入をしていない場合、以下の script を <head> の直下に記述します。 <!-- JQuery --> <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js'/> Font Awesome の導入 Font Awesome を導入していない場合、以下のコードを <head> の直下に記述します。 <link href='https://use.fontawesome.com/releases/v5.6.4/css/al
恵比寿のWebサイト制作・Webデザインチームのブログ。Webデザインやコーディング、SEO対策まで幅広く手掛けています。 今回はjQueryを使ってコピペで作成できる ドロップダウンメニューをご紹介します。 今回作成するドロップダウンメニューのデモがこちら DEMO 早速作成していきましょう! jQueryを読み込ませる。 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> これをHTMLのbodyの閉じタグの前に入れましょう。 HTMLで形を作る。 <ul class="dropdwn"> <li>HOME</li> <li>A <ul class="dropdwn_menu"> <li><a href="#">A1</a></li> <li><a href=
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く