HTML CSS 【サンプルコードあり】ヘッダーのナビゲーションメニュー 3パターン作ってみた サイトのナビゲーションメニューでよく見る3タイプのコードを記録してみました。HTML・CSSのサンプルコードありよかったら参考にしてください。今回作成したナビゲーションメニューリセットCSSパターン1 文字inline使用li に inli... 2022.11.15 HTML CSS
VScode Visual Studio Code英語表示になったのを日本語表示にする方法 VScode言語設定 図解いり VScodeのメニュー部分を日本語にする方法を図を使って説明してます。Visual Studio Code使ってたら、突然メニュー部分が突然英語表示にちょっとビビった!今までは日本語で表示されてたのに・・そんな時の対処法簡単だったんで、記事... 2022.11.03 VScode
HTML CSS 【サンプルコードあり】テキスト(文字) を枠線だけで表示する方法。文字の中透過して枠線で文字 文字の中が透明で、文字の外枠だけが表示される方法。CSSでテキスト文字の縁取りをする方法を書いてます。サンプルコードも記述してますので初心者の人必見。CSSで装飾してると後で色の変更やサイズ変更などのカスタマイズも簡単になり文字の表現が豊かで綺麗になる。 2022.10.21 HTML CSS
HTML CSS Googleフォームと連携してサイトのお問い合わせフォームの作成やってみた。IDの取得がちょっとわかりにくかった【サンプルコードあり】 サイトのお問い合わせフォームとGoogleフォームと連携すると見た目を自由にカスタマイズすることが出来る。その連携が今回出来たんで、忘れないように記事にしました。よかったら参考にして下さい。今回行った手順(作り方)HTMLで表示したいレイア... 2022.09.05 HTML CSS
HTML CSS 【サンプルコードあり】drawer.js を使って、ドロワーメニューを作成した時、内部リンクの場合メニューが閉じない現象になるので、それを解消する方法が簡単だった。 drawer.js を使うと ドロワーメニューを簡単に作成することが可能今回 drawer.jsで、ページ内リンクをクリックした時、ページは変化するけど、メニューが開いたままになった。ドロワーメニューメニューの閉じない場合。解決方法が見つか... 2022.09.04 HTML CSS
HTML CSS 【サンプルコードあり】display flexやinline-block で横並びでボタンの配置の為 position: absolute したら要素が下に潜り込んでしまった時にやった事 flex や inline-block;で横並びした時、端のボタンをposition: absolute;で配置したら、浮かせた要素の下に入り込んで重なってしまってちょっと悩んだ。試行錯誤の末解決出来たのでそのコードも書いてます。 2022.08.30 HTML CSS
VScode VSCodeの拡張機能 Live Preview 使うとVSCodeでサイトのプレビュー画面も見れて便利 VSCodeの拡張機能 Live Preview 使うとVSCodeでサイトのプレビュー画面も見れて便利と聞いたので試しに使ってみたら便利で良かったので、Live Previewが使えるようにする方法図を使って記事にしました。 2022.08.25 VScode
HTML CSS 【サンプルコードあり】flexで横並びにした時、文字(テキスト)が縦1列になってしまった時、これで治りました。 flexで横並びにした時、文字(テキスト)が縦1列になってしまった時にこの方法で治りました。実際にボタン作成時に起きた現象のコードと実際に解決できたコードのサンプルも記載してるので画像のようなボタンが作成できます。参考にしてください。 2022.08.22 HTML CSS
JavaScript drawer.js でドロワーメニューを簡単作成 でもjQueryのプラグインがあると動かない場合ある。【サンプルコードあり】 今回、drawer.js でドロワーメニューが簡単に装着できると効いたので早速実装してみました。実装はほんとに簡単で、head内にdrawer.cssなどを追加、body内に決められたコードを挿入。最後</body>の直前にscriptコー... 2022.08.19 JavaScript
プログラミング Nobilista(ノビリスタ)|クラウド型 最新の検索順位チェックツールが今人気みたいです。 ブログの運営してると検索順位のチェック必要ですよね。NobilistaはWebサイトの検索順位を完全自動でチェックする「クラウド型順位チェックツール」がありました。インストール不要でWindows・Mac問わず、今すぐに利用を始めることがで... 2022.08.10 プログラミング