CSS– tag –

疑似要素ってなに？ 疑似要素とは、見た目だけ「あるように見せる」要素のこと！つまり…HTMLには書かれていないけど、CSSだけで、前や後ろに文字やマークを追加できる仕組みです。 htmlに星マークはないですが、CSSだけで表示させることができます。 こん...

「WEBサイトってどう動いてるの？」そんな初心者の疑問を、たとえ話を交えてやさしく丁寧に解説。これを読めばWEBの基本がまるわかり！ WEBサイトの仕組みとは？初心者にもわかりやすくやさしく解説！ 「WEBサイトってどうやって見られるの？」「インター...

チェックボックスとは 一言で言うと…「はい・いいえ」「する・しない」など、選ぶかどうかを決める時に使います。よくある使い方の例として①利用規約に同意しますサービスを使う前に、「ルールに同意しますか？」というときのhtmlコードがこちら↓インプッ...

みなさん、Webサイトを見ていて「リンク」にマウスを乗せた時、ポインター（マウスの矢印）が"指の形"に変わるの、見たことありますよね。実はあの「指マーク」、マウスを乗せたという"状態"に反応して、見た目が変わっているんです。でも、HTMLのコードを...

ナビゲーションメニューから各セクションへスムーズにスクロールする方法 ランディングページ（LP）などで、ナビゲーションメニューをクリックしたときにページ内の特定の場所へスクロール移動する方法を紹介します。WordPressでも使用可能なシンプルな方...

属性とは（おさらい） 属性とは「タグの中に書かれている　ひとことメモ　を見て、CSSデザインを当てる方法です！＊属性を理解する記事はこちら→「 属性 」って何？ タグだけでは物足りない！属性で伝わるhtml class名を使ったデザインの仕方 ・テキストボ...

【初心者向け】npmとは？Web制作でよく使う「便利ツール」の正体をわかりやすく解説！ 「npmって何？」「JavaScriptの勉強を始めたら出てきたけどよくわからない…」 そんな初心者の方に向けて、npmとは何か？どんな場面で使うのか？を、やさしく・具体的に...

今回は「子孫セレクタ」「子セレクタ」「隣接セレクタ」という３つのセレクタを使って、シンプルで読みやすいブログ記事を一緒に作ってみましょう！↓これを作ります htmlコードの作成 htmlコードを書きましょう！ ・emmet機能を使って簡単作成！ ・クラス...

スクロールでふわっと表示されるアニメーションの実装方法【初心者向け・コピペOK】 Webサイトをおしゃれに見せたい！そんなときに使えるのが「スクロールでふわっと表示されるアニメーション」です。 この投稿では、初心者の方でも理解できるように、HTML...

「要素」はHTMLの超基本！タグの意味や構造をしっかり理解することで、読みやすくて正しいコードが書けるようになりますよ！今回は、要素の基本と構造の仕組みをわかりやすくまとめています。 要素のおさらい 要素とは→開始タグ＋内容＋閉じタグ＝要素 要...