- 2024.02.16
【決定版】CSSで要素を横並びにする3つの方法
HTML要素を横並びにするCSSプロパティは複数あります。本記事では、サンプルコードを用いて要素を横並びにするCSSプロパティの種類と使い方を解説します。 「float」で要素を横並びにする floatとは floatは、指定した要素を浮かせた状態にして、ほかの要素を回り込ませるCSSプロパティです。floatプロパティを用いることで縦に並んでいるHTMLの要素を横並びに配置できます。 float […]
鷺坂りな ＠TechMania編集部
- 2024.02.09
CSSのmarginやpaddingを完全に理解して余白を制す
余白はWebページを見やすくするうえで重要です。しかし、marginとpaddingがあってそれぞれにルールがあり…と混乱しやすく、挫折しかけているという人も少なくないでしょう。そこで本記事では、余白の指定方法を使いこなせるよう、margin・paddingについてステップバイステップで解説していきます。ぜひ今後のCSS学習に役立ててください。 marginとpaddingの違い まず、両者の違い […]
- 2024.02.02
【SQL】NULLの扱い方をサンプルコードで分かりやすく解説
NULLの判定には「IS NULL」や「IS NOT NULL」を使用しますが、その扱いには注意が必要です。本記事ではデータベースにおける「NULL」値について解説します。ぜひ今後のSQL学習の参考にしてください。 そもそも「NULL」とは？ NULL値とは、値と言っていますが、わかりやすく言うと、「データが存在しない」という概念です。データベースにおいては、フィールドに値が入力されていない場合に […]
- 2024.02.01
コピペだけ！CSSの見出しデザイン31選【サンプルコード】
本記事ではCSSの見出し（h1〜h6タグ）のデザインパターンを31個紹介します。CSSコードをコピペするだけで利用できます。また、組み合わせて自分好みのデザインにすることも可能なのでぜひいろいろ試してみてください。 プログラミングの基礎からサイト制作まで↓実践力が身につくプログラミングスクール↓ ≫モニター割引キャンペーン実施中！≪ HTMLコード 本記事ではすべて、以下のHTMLコードを使用しま […]
- 2024.01.26
Composition APIとは？Options APIとの違いや書き方をサンプルコードで解説
Composition APIとは？ Composition APIとは、Vue3から導入された新機能で、コンポーネントを実装するAPIを指します。「リアクティブな値やそれに関連した関数をコンポーネントから切り離して扱える」という特徴を持つことから、コードの再利用性や保守性の向上が期待されています。Vue2のサポートが2023年12月31日をもって終了したため、Vue2からVue3への移行を検討し […]
- 2024.01.19
マークダウン記法とは？基礎知識や書き方をサンプルコードで解説
マークダウン記法とは マークダウン記法とは、テキスト構造を記述する「マークアップ言語」の一つです。マークアップ言語にはHTMLやXMLもあります。Webブラウザなどで表示することを想定した記法であり、マークダウンの記述ルールで記述した内容は変換ソフトを使えばHTML形式などに変換できます。ただ、その記法の簡易さから、そのままテキスト文書としても読みやすいという特徴があります。 マークダウン記法とH […]
- 2024.01.19
HTMLで画像リンクを貼る方法をサンプルコードで解説
Webサイト制作において画像をクリックすると商品ページや申し込みフォームに遷移させたいといった場合など、画像リンクの用いられる機会は非常に多くあります。本記事では、HTMLで画像をリンクとして設定する方法を、サンプルコードを用いて具体的かつわかりやすく解説します。 画像リンクとは 画像リンクとは、Webページ上で画像自体をハイパーリンクとして機能させることで画像をクリックすると別のWebページに遷 […]
- 2024.01.19
【決定版】CSSで要素を中央に配置する方法を解説
「CSSで要素を中央に配置する」といってもHTML要素の種類や中央配置にする方向などによって取る方法は異なります。それぞれの手順は難しいものではありませんが、単純にやり方が複数あることで難しく感じてしまう人もいるでしょう。 プログラミングの基礎からサイト制作まで↓実践力が身につくプログラミングスクール↓ ≫モニター割引キャンペーン実施中！≪ 【予備知識】ブロック要素・インライン要素・インラインブロ […]
- 2024.01.12
CSSのdisplay:inline、display:block、display:inline-blockの違いを解説
displayプロパティ CSSの「display」とは、要素の表示形式を指定するプロパティです。displayプロパティを使えばブロックレベル要素をインライン形式で表示させたり、逆にインライン要素をブロックレベル形式で表示させることができます。そのため、「構造はブロックレベル要素だけどインラインとして扱いたい（逆も然り）」といった場合などに用いられます。 プログラミングの基礎からサイト制作まで↓ […]
- 2023.12.29
【CSS】position:absolute;とは？要素を好きな位置に配置する方法を解説
Webサイト制作において、理論上は自由にページデザインを実装できます。しかし、画像やテキストを置きたい位置に配置できず、思いどおりのWebサイトにならない！とお困りの人もいるのではないでしょうか。そこで本記事では、画像の上にテキストを表示させるというように、任意の位置に要素のレイアウトを実現する「position:absolute;」について解説します。 position:absolute;とは […]