言語

言語 カテゴリー記事(更新日順)

  1. 「オフスクリーン画像の遅延読み込み」への対策
    カテゴリ: HTML, ホームページ
    作成日:
    PageSpeed Insights 対策の一環.他の対策は以下を見てください. Youtube の動画を複数埋め込みしたページの高速化 次世代フォーマットでの画像の配信 ウェブフォント読み込み中の全テキストの表示 第三 […]
  2. 【拡張機能】Chromeで文字コードを変更する方法【文字化け対策】
    カテゴリ: HTML
    作成日:
    Chrome拡張機能で文字コード変更 Chromeには文字コードの変更・設定機能はない Chromeには文字コードの変更機能が存在しないので、「拡張機能」を使用します。 文字コードを変更できる拡張機能「Charset」 […]
  3. 【CSS】z-index が効かない場合の注意点
    カテゴリ: CSS, HTML
    作成日:
    z-index が効かない場合に z-index は要素の重ね合わせの順番を定義できます。 以下のように使いますが、数字が大きいほど上に表示されます。 #test { z-index: 1; } スタイルシートを使って、 […]
  4. 【JavaScript】ボタンクリックでパスワード(テキスト)の表示・非表示を切り替える
    カテゴリ: JavaScript, 知識
    作成日:
    パスワードを入力する機会が増えた昨今では必須の機能と言える、パスワード表示ボタンのクリックでテキストの表示・非表示をjavascriptを使って切り替える方法を紹介します。 今回のサンプルコードではパスワード入力欄を作成 […]
  5. 【CSS】ボタンクリックでパスワード(テキスト)の表示・非表示を切り替える
    カテゴリ: CSS, HTML, 知識
    作成日:
    概要 ログイン画面で、パスワード表示ボタンをクリックするとパスワードが表示されるという機能は、現在では当たり前になっています。 ですが、もしパスワード表示ボタンが無く、表示・非表示が切り替えられなかったらとても不便に感じ […]
  6. CSSでHTMLのタグを書き換える
    カテゴリ: CSS, HTML, 知識
    作成日:
    CSSでタグを書き換えることはできない CSSに触りなれていないと、CSSでHTMLのタグを書き換えたいと思うことがあるかもしれません。しかし、CSSではタグを書き換えることはできません。 実際に<CSS タグ 書き換え […]
  7. 【JavaScript】目のマークでパスワードの表示を切り替える実装方法
    カテゴリ: HTML, JavaScript
    作成日:
    目のマークでパスワードの表示非表示の切り替え実装 以前、表示・非表示ボタンでパスワードの表示を切り替える方法をご紹介しましたが、今回は目のマークを使用したパスワード表示非表示の実装方法をご紹介します。 javascrip […]
  8. 【CSS】目のマークでパスワードの表示を切り替える実装方法
    カテゴリ: CSS, HTML, 言語
    作成日:
    目のマークでパスワードの表示非表示を切り替える 目のアイコンをクリックすることでパスワードの表示非表示の切り替える方法を今回は CSS で実装しました。 javascript での実装は【JavaScript】目のマーク […]
  9. 【CSS】簡単な下線の引き方【HTML】
    カテゴリ: CSS, HTML
    作成日:
    本文中のテキストや見出しに下線を付けたい時があると思います。text-decoration や boder を利用してとても簡単に実装できますので、用途別に応じて解説します。 下線を引く まず、下線のサンプルを用意しまし […]
  10. 【WordPress】最終更新日をヘッダに出力
    カテゴリ: php, 知識
    作成日:
    WordPress は php で動作しているので,最終更新日のヘッダがつかない. レスポンスヘッダに最終更新日のヘッダをつけたい場合,以下のようなスクリプトを functions.php に挿入する. // Last- […]
  11. 【WordPress】投稿の一覧ページにリセットされない連番を振る方法
    カテゴリ: CSS, php
    作成日:
    アーカイブページで連番を振る方法 wordpressで検索結果一覧を表示したいときや、人気度に応じてランキング形式で表示したいときなど、投稿タイトルの先頭に連番を振りたい場面があると思います。 しかし、1ページ目は問題な […]
  12. 画像スライダー Swiper の設定・使い方 (HTML, CSS, JavaScript)
    カテゴリ: CSS, HTML
    作成日:
    ホームページで使われる「画像スライダー」は種類が多数あり,どれを使うか迷う. 無料で商用利用可能な Swiper 少し調べてみた限り,Swiper というスライダーがとてもよく出来ていると思ったのでこのスライダ―の使い方 […]
  13. Hタグ(見出しタグ)とHTML5 アウトライン
    カテゴリ: HTML, 知識
    作成日:
    本記事は HTML Standard のサイトの説明に基づいている. アウトラインとは,「概要,あらまし,輪郭」などと辞書にあるが,まさにその通りで見出し(heading content)ごとに文章をグループ(secti […]
  14. Chrome で見て input タグで入力できないことがある場合
    カテゴリ: HTML
    作成日:
    些細なことだが,驚いたことがあったので書いておく. 「chrome th input 入力できない」で検索しても現時点で出てこなかったので,そういう問題に出会った人もあまりいない可能性もある. 全く意識せずにいつものよう […]
  15. リッチリザルトの ロゴ への対応
    カテゴリ: HTML, 知識
    作成日:
    引き続き,リッチリザルトへの対応の記事. 弊社(レクタス)のロゴ Google ではロゴ | Google 検索セントラル | Google Developersで記述方法を説明している. ロゴと言っても https:/ […]
  16. CSSだけで外部サイトへのリンクにマーク(アイコン)をつける方法
    カテゴリ: CSS
    作成日:
    リンクが外部に飛ぶことを示すアイコン(リンクアイコン)をつけると押すと別サイト(外部リンク)に行くことが分かりやすいので親切である. なぜ,このようなリンクアイコンを設けるのかという必要性の観点からすると「クリックすると […]
  17. CSSで円(丸)を描き,内側にテキスト(文字)を入れる
    カテゴリ: CSS, HTML
    作成日:
    円をかいて,中に文字を入れるとはこのような絵のこと. 上 左 中央 右 下 CSS と HTML による円とテキストの記述方法 中の文字の位置指定のポイント CSS は以下のようになる. 円は position: rel […]
  18. 【CSS】テキスト(見出し,タイトル)に横線をつける方法
    カテゴリ: CSS, HTML
    作成日:
    HTMLのコーディングで必要になり,ちょっと調べたので備忘録. 見出しなどの文字列の両側(両端,左右)に横線(ハイフン・横棒)をつけて,中央にもっていきたい場合がある. - を使うと ------ のように切れ切れになっ […]
  19. リッチリザルト への BlogPosting での対応
    カテゴリ: HTML, 知識
    作成日:
    リッチリザルトとは リッチリザルトは、通常の青色リンクよりも高度な機能を持つ、Google サービス(Google 検索など)での検索結果です。 引用: リッチリザルトテスト(google) つまり,より情報量の多い豊か […]
  20. 【CSSのみ】レスポンシブな多階層ハンバーガーメニューの実装方法(サンプル付き)
    カテゴリ: CSS, HTML, JavaScript, ホームページ
    作成日:
    ハンバーガーメニューとは スマホでホームページを見ていると右上に「三」のようなマークを見ることが多いと思う. これを見かけがハンバーガーのようだからハンバーガーメニューと呼ぶようだ. 恐らく,箇条書きのメニューを遠くから […]
Pagetop