aタグのリンクを飛ばないようにする
リンク先に飛ばないように一時的に無効にしてください。とご要望があった場合があったのですが、href属性の値で指定したurlを外すだけでは、そのページのトップに飛んでしまうので、aタ […]
HTMLのbrで改行した文章にする
HTMLで文章を任意の位置で改行したい場合にはbrタグを使用します。 文章だけでは、その文章を囲んでいる要素に合わせて自動で改行が行われますが、HTMLのbrを文章の改行したい部分 […]
gulpのBrowser-SyncでHTMLとCSSをプレビューする
今回はgulpのbrowser-syncを設定することで、ejsとsassからHTMLとCSSにコンパイルしたファイルを自動リロードしてプレビューできるようにしたコードを書き記した […]
GulpでSass(SCSS)をCSSにコンパイルできるようにする
GulpでSassのSCSSをCSSにコンパイルできるようにするための環境構築を簡単にまとめました。 コンパイル環境構築の目的は、Gulpでscssをcssにコンパイルしたcssフ […]
GulpでEJSからHTMLにコンパイルできるようにする
GulpでEJSからHTMLにコンパイルできるようにするための環境構築を練習してみたときのことをメモがてらまとめました。 ejsファイルを修正してコンパイルしたhtmlファイルを、 […]
円弧をCSSのborder-radiusで表示する
円弧のデザインにした要素を作成したかったのでCSSのborder-radiusを使用して表現してみました。 CSSで円弧にした要素を作成してやりたかったことは、以下の画像のように背 […]
WordPressに静的サイトを共存させてみる
WordPressと静的サイトを共存させてみたときのやり方についてです。 「共存させてみる」とかカッコつけて言ってますが、WordPressをインストールしているフォルダと同じ階層 […]
GitとGitHubでHTMLファイルを管理する
ウェブサイト製作の勉強で作成したHTMLファイルやCSSファイル、画像などのフォルダがローカルに溜まってきたのでGitHubで管理することにしました。 コマンドでローカルのファイル […]
WordPressのesc_urlでURLをエスケープ処理する
WordPressのesc_urlでURLをエスケープ処理するときに必要な知識としてesc_urlのパラメータと簡単なesc_urlの使用例。そしてesc_urlが関数の内部でどの […]
Flexboxで最後の行を左寄せにするやり方
CSSのFlexboxでレイアウトを組むときflex-wrap: wrapで折り返しを行い、フレックスコンテナ(親要素)内部のフレックスアイテム(子要素)の配置をjustify-c […]
WordPressのesc_htmlでHTMLをエスケープ処理する
WordPressのesc_htmlはHTMLをエスケープ処理するときに使用するWordPressで用意されている関数です。 esc_htmlを使用するクセが付いていなかったのでH […]
aタグでメールアドレスをリンクする方法
HTMLのaタグにメールアドレスをリンクするとメールリンクになり、クリックした場合には使用しているメーラーが開いてメール送信ができるようになります。 aタグでメールアドレスをリンク […]
CSSでテーブルを横並びから縦並びに切り替える
HTMLのtable要素でth、tdをマークアップしたテーブルをCSSで横並びから縦並びのレイアウトに切り替える記述を記事にまとめました。 CSSでテーブルを横並びから縦並びに切り […]
HTMLのbrタグをCSSで非表示にするやり方
HTMLのbrタグで改行した部分をCSSで非表示にするやり方と使用例を紹介します。 brタグをCSSで非表示にするやり方については細かい説明が必要ないくらい簡単です。 […]
WordPressの404.phpを作成してエラーページを表示する
WordPressでは404.phpのテンプレートファイルを作成してテーマフォルダに設置すると、存在しないページにアクセスがあった場合には404エラーページとして404.phpに記 […]
HTMLとCSSでポップアップを表示する
HTMLとCSSでポップアップを表示する作り方を説明します。 ウェブサイトでのポップアップはボタンをクリックしたときに、最初は隠れていたコンテンツがボタンに連動して表示される動作の […]
