Composition APIとは？ Composition APIとは、Vue3から導入された新機能で、コンポーネントを実装するAPIを指します。「リアクティブな値やそれに関連した関数をコンポーネントから切り離して扱える」という特徴を持つことから、コードの再利用性や保守性の向上が期待されています。Vue2のサポートが2023年12月31日をもって終了したため、Vue2からVue3への移行を検討し […]
マークダウン記法とは マークダウン記法とは、テキスト構造を記述する「マークアップ言語」の一つです。マークアップ言語にはHTMLやXMLもあります。Webブラウザなどで表示することを想定した記法であり、マークダウンの記述ルールで記述した内容は変換ソフトを使えばHTML形式などに変換できます。ただ、その記法の簡易さから、そのままテキスト文書としても読みやすいという特徴があります。 マークダウン記法とH […]
Webサイト制作において画像をクリックすると商品ページや申し込みフォームに遷移させたいといった場合など、画像リンクの用いられる機会は非常に多くあります。本記事では、HTMLで画像をリンクとして設定する方法を、サンプルコードを用いて具体的かつわかりやすく解説します。 画像リンクとは 画像リンクとは、Webページ上で画像自体をハイパーリンクとして機能させることで画像をクリックすると別のWebページに遷 […]
「CSSで要素を中央に配置する」といってもHTML要素の種類や中央配置にする方向などによって取る方法は異なります。それぞれの手順は難しいものではありませんが、単純にやり方が複数あることで難しく感じてしまう人もいるでしょう。 プログラミングの基礎からサイト制作まで↓実践力が身につくプログラミングスクール↓ ≫モニター割引キャンペーン実施中！≪ 【予備知識】ブロック要素・インライン要素・インラインブロ […]
displayプロパティ CSSの「display」とは、要素の表示形式を指定するプロパティです。displayプロパティを使えばブロックレベル要素をインライン形式で表示させたり、逆にインライン要素をブロックレベル形式で表示させることができます。そのため、「構造はブロックレベル要素だけどインラインとして扱いたい（逆も然り）」といった場合などに用いられます。 プログラミングの基礎からサイト制作まで↓ […]
Webサイト制作において、理論上は自由にページデザインを実装できます。しかし、画像やテキストを置きたい位置に配置できず、思いどおりのWebサイトにならない！とお困りの人もいるのではないでしょうか。そこで本記事では、画像の上にテキストを表示させるというように、任意の位置に要素のレイアウトを実現する「position:absolute;」について解説します。 position:absolute;とは […]
CSSにはHTML要素を横並びにするプロパティがいくつか存在します。しかし、レイアウトが崩れてしまう、float単体だと使いづらいと、お困りの人に紹介したいのが「flexbox」というプロパティです。 本記事では、HTML要素を横並びにするCSSプロパティの新定番「flexbox」とその使い方を紹介します。サンプルコードを用いて解説するのでぜひ参考にしてください。 あなたのご希望に沿った案件が必ず […]
CSSの要素名やクラス名の後に「:before」や「:after」といった記述がされていることがあります。これらは「擬似要素」といい、HTMLのソースコードに影響を与えずにスタイルを追加できます。とても便利な要素なのでその記述方法や使用場面を十分に理解して活用しましょう。本記事ではその擬似要素の基本からサンプルコードを用いた活用例まで段階的に解説していきます。 擬似要素とは CSSの擬似要素とは、 […]
Webページ制作において、意図せぬテキスト改行で表示が崩れてしまった経験はありませんか？テキストの改行は、Webページのデザインを定義するCSSで設定できます。本記事では「CSSでテキストをbrタグみたいに改行したい」「改行させたくない」「英単語の途中で改行させたくない」「記号の前で改行させたくない」というように、目的別に分けてCSSでの改行に関するルールの指定方法を解説します。 あなたのご希望に […]
データベース設計で用いられる手法の一つであるER図。しかし、書き方が分からないという人も多いのではないでしょうか。そこで、本記事ではER図の概要から、数種類ある記法の中でもテキストでグラフやチャートを描けるmermaid記法によるER図の書き方まで、段階的に解説します。サンプルコードも記述するので学習の参考にしてください。 まずはER図の言葉の意味とER図に出てくる用語についてみていきましょう。 […]
