HOME > snownotes snownotes [React] HTML1枚で、JSXを使ってReactをブラウザに表示させる Reactを使って、画面に文字を表示させてみる。 Reactで画面に表示させる方法は二種類 どうやらReactで画面に表示させるには、二種類の方法があるらしい。 CDNリンクを使用してReactを使用 ... #HTML/CSS #React [HTML] HTMLで最初に書くべきタグ HTMLを書き始めるために、最初に必要なタグの備忘録。 HTMLを書き始めるには、下記のタグが必要。 <!DOCTYPE html> <!DOCTYPE html>のことをドキ ... #HTML/CSS [github] レポジトリの作成のやり方 レポジトリの作成方法について整理する。 リモートレポジトリの作成 まずはレポジトリを作成。 create repositoryのボタンを押す。 詳細を決める。 Repository name : レポ ... #Github [HTML/CSS] 別ファイルに写真を入れた時のパスの修正方法 別ファイルに写真を入れた時のHTMLのパスの修正方法の備忘録。 HTMLファイルと写真が同じフォルダにある時 HTMLファイルと写真が同じフォルダにある時。 写真のパスの書き方としては、下記のようにな ... #HTML/CSS #image [css] レスポンシブの時にdiv要素の順番を入れ替える方法 CSSを使って、HTMLサイトのレスポンシブ対応の時にHTML構造のdiv要素の順番を入れ替えるやり方を整理する。 スマホ対応のサイトを作る時、レスポンシブの時だけHTMLのdiv要素の順番が入れ替わ ... #flexbox #HTML/CSS #レスポンシブ [html / css] ヘッダーメニューをアイコンに変えてレスポンシブ対応させる 横幅がスマホサイズになった時にヘッダーメニューをアイコンに変えて、レスポンシブ用のヘッダーメニューにするやり方を説明する。 完成のイメージ 完成系は下。ある幅までいくと、ヘッダーメニューが3本線のアイ ... #header #HTML/CSS #レスポンシブ [HTML / CSS] flexで画像や説明文を横並びさせる Flexboxを使って、画像と説明文のセットを横一列に並べるレイアウトの作り方を説明する。 完成形 下記のようなイメージを作る。 HTMLの用意 まずはHTMLを用意する。 「offers」というクラ ... #HTML/CSS #image [HTML/CSS] 写真と文字を左右に配置するレイアウトを作る方法 ウェブサイト作成の際の備忘録。 イメージとしては、下記のようなレイアウトを作成する時。 HTML 下記のように用意。 すると縦のように並ぶ。 CSS 上記の「cozyspace-img」クラスと「co ... #HTML/CSS #image [CSS] ヘッダーを上部に固定する方法 ヘッダーを固定させるための備忘録。 最初にヘッダーを作ると、固定されていないので、スクロールした時にヘッダーが消えてしまう。 これをスクロールしても上部に固定させるようにする。 position: f ... #header #HTML/CSS [CSS]見出しの下線デザインでタイトルより短い下線を表示させる HTMLサイトの見出しの下線デザインで、CSSを使ってタイトルより短い下線を表示させる方法を説明する。 このABOUTの下のボーダーラインを作成する。 HTMLの用意 HTMLはシンプルに<H1 ... #HTML/CSS « Prev 1 … 20 21 22 23 24 … 33 Next »