マンガでわかるホームページ作成
ホームへ
CSSを強制的に上書きする方法
2023年02月09日
「CSSが効いてないから強制的に上書きしたい！」CSSを強制的に上書きする方法を解説します。
この記事を読む
【Twitter】タイムラインからリツイートを一括で消す/非表示にする方法
2022年12月17日
「Twitterにリツイートがあふれて、フォロワー自身のツイートが見れない！リツイートを消したい！」Twitterのタイムラインからリツイートを消す方法を紹介します。
この記事を読む
CSSだけで特定の子要素を持つ親要素を指定する方法(hasの使い方)
2022年12月17日
「この子要素を持つ親タグにだけCSSを指定したい！javascriptは使いたくない！」CSSだけで特定の子要素を持つ親要素を指定する方法を解説します。
この記事を読む
【html】divの乱用･使いすぎは問題なのか解説
2022年10月22日
「divの使い過ぎはよくない！」とはよく聞くけどほんと？なんでそういわれるの？divの乱用･使いすぎは問題なのか解説します。
この記事を読む
【CSS】display:tableを使ってdivで表を作る方法
2022年10月09日
「displayを使えばdivだけで表をつくれるってホント!?」display:tableを使ってdivで表を作る方法を解説します。
この記事を読む
【意外な解決法】原因不明のブルースクリーン頻発時に試すこと
2022年10月06日
停止コード「CRITICAL PROCESS DIED」「REGISTRY FILTER DRIVER EXCEPTION」「SYSTEM SERVICE EXCEPTION」などの原因不明のブルースクリーンが頻発する方へ試してほしいことを紹介します。
この記事を読む
【html/CSS】tableの縦横を入れ替える方法
2022年09月25日
「パソコンで横長の表をスマホで縦にしたい！」tableの縦横を下記のように入れ替える方法を解説します。
この記事を読む
【html/CSS】tableを画面いっぱいに広げる方法
2022年09月22日
「tableをブラウザの画面いっぱいにしたい！」tableを画面いっぱいに広げる方法を解説します。
この記事を読む
【html/CSS】余白(padding,margin) をレスポンシブで可変する方法
2022年09月17日
「余白をパソコンでは大きく、スマホでは小さくしたい！」余白(padding,margin)をレスポンシブで可変させる方法を解説します。
この記事を読む
【html/CSS】謎の余白,隙間をなくす方法7選
2022年09月12日
「作った覚えのない余白ができてしまう!?この余白を消したい！」謎の余白の原因および、その余白をなくす方法を解説します。
この記事を読む
【html/CSS】ul liの点が出ない/list-styleが効かない原因と解決方法
2022年09月06日
「liの点が出ないんだけど!?」「list-styleが効かない!?」ul liの点が出ない、list-styleが効かない原因と解決方法を解説します。
この記事を読む
【html】ulやliの中にdivやpやaをいれてもいいか解説
2022年08月31日
「ulの中にliをいれるのは知ってるけど、他のタグをいれたらどうなるの？」ulやliの中にdivやpやaをいれてもいいのか？解説します。
この記事を読む
【CSS】flex-wrapが効かない、折り返さない原因と解決方法
2022年08月28日
「flex-wrap:wrapを指定したのに折り返さないんだけど!?」flex-wrapが効かない、折り返さない原因と解決方法を解説します。
この記事を読む
【html/CSS】スクロールできない原因と解決方法
2022年08月27日
「サイト全体をスクロールできないんだけど!?」「ここをスクロールさせたいのになぜかできない!?」スクロールできない原因と解決方法を解説します。
この記事を読む
【html/CSS】子要素が親要素から縦に はみ出る対処法
2022年08月26日
「子要素が親要素からはみでちゃったよ！縦に！」子要素の高さにより親要素から縦に はみ出てしまったときの対処法を解説します。
この記事を読む
【html/CSS】formを中央寄せする方法
2022年08月23日
「formを中央寄せするにはどうすればいいの!?」 formを中央寄せする方法を解説します。
この記事を読む
【CSS】position:absoluteで上下左右中央寄せする方法
2022年08月21日
「position:absoluteで中央寄せするのどうやるんだったっけ？」position:absoluteで上下左右中央寄せする方法を解説します。
この記事を読む
【html/CSS】インライン要素を縦横中央寄せする方法
2022年08月19日
「aやspan、ただのテキストとかのインライン要素の中央寄せってどうやるんだっけ？」インライン要素を縦横中央寄せする方法を解説します。
この記事を読む
【html/CSS】画像の上に文字を重ねたいのにできない原因と解決方法
2022年08月17日
「画像の上に文字を重ねたいのにうまくできない！」画像の上に文字を重ねたいのにできない原因と解決方法を解説しま
この記事を読む
【html/CSS】右寄せができない原因と解決方法
2022年08月16日
「右寄せしたいのに右寄せにならない！なぜ!?」右寄せができない原因と解決方法を解説します。
この記事を読む
【CSS】transitionが効かない原因6つと解決方法
2022年08月14日
「transitionでゆっくり変化させたいのに一瞬で変わるんだけど!?」transitionが効かない原因と解決方法を6つ紹介します。
この記事を読む
【CSS】:visitedが効かない原因5選
2022年08月13日
「訪問したらaタグを変化させたいのにvisitedが効かないんだけど!?」:visitedが効かない原因を5つ紹介します。
この記事を読む
幻塔(PC版)でPS4コントローラーを使う方法(割り当ても可能)
2022年08月12日
「幻塔（Tower of Fantasy）でPS4コントローラーを使いたい！キー割り当てもしたい！」幻塔(ToF)でコントローラーを使う方法を紹介します。
この記事を読む
【CSS】hoverで別の要素を動かしたいのに効かない原因5選と解決方法
2022年08月12日
「hoverしたときに別の要素を動かせるって聞いたのに効かないよ!?」hoverで別の要素を動かしたいのに効かない原因と解決方法を5つ紹介します。
この記事を読む
【html/CSS】リンクaタグの下線が消えない原因と解決方法5選
2022年08月10日
「text-decoration:noneを指定しているのにリンクの下線が消えないんだけど!?」リンクaタグの下線が消えない（text-decoration:noneが効かない）原因と解決方法を5つ紹介します。
この記事を読む
【html】リンクからpdfやwordなどのファイルを開く方法
2022年08月08日
「aタグでhtmlにリンクする方法はわかったけどpdfにはどうやってリンクするの？」リンクからpdfやwordなどのファイルを開く方法を解説します。
この記事を読む
【html】「ファイルにアクセスできませんでした」の解決方法
2022年08月07日
「ファイルが見つかりません」「ファイルにアクセスできませんでした」のエラーになる原因と解決方法を解説します。
この記事を読む
【CSS/html】文字だけに下線を引く方法
2022年08月06日
「文字に下線を引こうとしたら外枠に線が引かれちゃう」「横いっぱいじゃなくて文字の長さだけ線を引きたい」文字だけに下線を引く方法を解説します。
この記事を読む
【CSS/html】inputテキストボックスに下線だけを引く方法
2022年08月05日
「テキストボックスの線を下線だけに引きたい！」inputテキストボックスに下線だけを引く方法を解説します。
この記事を読む
【CSS/html】inputテキストボックスが はみ出る原因と解決方法
2022年08月02日
「テキストボックスが枠からはみ出てる!?」inputテキストボックスがはみ出る原因と解決方法を解説します。
この記事を読む
【html/CSS】input,textareaの高さ,行間を調整する方法
2022年08月01日
「テキストボックスの高さを調節したい！」「テキストエリアの高さを行数指定したい！」nput,textareaの高さ,行間を調整する方法を解説します。
この記事を読む
【CSS/html】liの点や数字の色、大きさを変える方法【::marker】
2022年07月31日
「ul liの点を大きくしたい！」「ol liの数字の色を変えたい！」liの点や数字の色、大きさを変える方法を解説します。
この記事を読む
【html/CSS】inputボタンに疑似要素(before,after)を使う方法
2022年07月30日
「inputのボタンにbefore,afterで装飾をしたいのにできない!?」inputボタンに疑似要素(before,after)を使う方法を解説します。
この記事を読む
【html/CSS】入力されたらinputを変化させる方法
2022年07月29日
「入力漏れに気づけるよう、入力済みのテキストボックスの色を変えたい！」入力されたらinputを変化させる方法を解説します。
この記事を読む
【html/CSS】チェックボックス、ラジオボタンを非表示にする方法
2022年07月28日
チェックボックスの四角を消したい！チェックボックスをクリックの判定につかったり、オリジナルのデザインのチェックボックスを作るとき、元のチェックボックスを消したくなりますよね。inputのチェックボックス、ラジオボタンを非表示にする方法を解説します。
この記事を読む
あとがき
2022年07月27日
「マンガでわかるホームページ作成」を最後まで読んでいただきありがとうございます。最後になりますが頑張るあなたにメッセージを送ります！
この記事を読む
【CSS/html】inputを上寄せ,中央寄せ,下寄せする方法
2022年07月26日
「テキストボックスと単位を並べて下寄せしたい」「項目名とテキストボックスを並べて上寄せしたい」inputを上寄せ,中央寄せ,下寄せする方法を解説します。
この記事を読む
【CSS/html】inputを横に並べたときの余白,隙間を消す方法
2022年07月25日
「inputとinputの間にある隙間を消してピッタリくっつけたい！」inputテキストボックスを横に並べたときの隙間を消す方法を解説します。
この記事を読む
【CSS/html】inputテキストボックスの余白調節方法
2022年07月24日
「テキストボックスの枠と文字とくっついて気持ち悪い！」inputテキストボックスの余白調節方法を解説します。
この記事を読む
【CSS/html】inputテキストボックスのフォントサイズ変更方法
2022年07月23日
「テキストボックスの文字サイズがなんか小さい!?」inputテキストボックスのフォントサイズ変更方法を解説します。
この記事を読む
input(テキストボックス,ラジオボタン)の文字色を変える方法
2022年07月22日
「入力中のテキストボックスの色を変えたい」「選択されたラジオボタンの色を変えたい」CSSでinput(テキストボックス,ラジオボタン)の文字色を変える方法を解説します。
この記事を読む
【CSS/html】inputやボタンのフォントを指定,継承させる方法
2022年07月21日
「inputを別のフォントにしたい」input(テキストボックス),textarea,select,buttonのフォント(書体)を指定,継承させる方法を解説します。
この記事を読む
【CSS/html】画像の高さを揃える方法【レスポンシブ対応】
2022年07月20日
「縦の画像でも横の画像でもキレイにならべたい！」高さの異なる画像の高さを揃える方法を解説します。
この記事を読む
【CSS】複数のセレクタの同じ部分をまとめる方法【:whereの使い方】
2022年07月19日
同じ親の中にある別のセレクタだったり、違う親の中にある同じ名前のセレクタを指定するとき、同じ部分を何度も指定するのなんだか気持ち悪いですよね？複数のセレクタの同じ部分をまとめる方法を解説します。
この記事を読む
【jQuery/クッキー】初回読み込み(アクセス)時のみ実行する方法
2022年07月19日
「新規ユーザーかリピーターかによって別の動きをさせたい！」jQueryとクッキーを使って初回読み込み（アクセス）か2回目以降かを判定し、それぞれの条件で実行する方法を紹介します。
この記事を読む
【CSS/html】画像サイズを親要素に合わせる方法
2022年07月18日
「画像のサイズを親要素に合わせて縮小するようにしたい！」画像サイズを親要素に合わせる方法を解説します。
この記事を読む
【html/CSS】背景画像を繰り返さない方法
2022年07月17日
「backgroundで画像を一つだけ出したいのにたくさんでてくる!?」背景画像を繰り返さない方法を解説します。
この記事を読む
【CSS】background-image(背景画像)のサイズを可変、固定する方法
2022年07月15日
「背景画像の大きさを枠に合わせたい！」background-image(背景画像)のサイズを可変、固定する方法を解説します。
この記事を読む
【CSS/html】table,th,tdの文字色を変える方法
2022年07月12日
「このマスを目立たせるために文字色を変えたい」tableの文字色(フォントカラー)を変える方法を解説します。
この記事を読む
PSPlusプレミアム,エクストラ おすすめゲーム50選【5段階評価】
2022年07月12日
PS Plus プレミアムとエクストラのおすすめゲームタイトル50作品を5段階のランクをつけて紹介します。
この記事を読む
【html/CSS】ul liを箇条書きのまま中央寄せする方法
2022年07月11日
「箇条書きを一行のまま中央寄せしたい」ul liを箇条書きのまま中央寄せする方法を解説します。
この記事を読む
【html/CSS】tableのマスに斜線を引く方法
2022年07月10日
「tableのなにもないマスに斜線を引きたいけどどうやるの？」tableのマスに斜線を引く方法を解説します。
この記事を読む
【html/CSS】tableのセルや文字の隙間を詰めて小さくする方法
2022年07月06日
「スマホになったときtableの隙間を詰めて小さくしたい！」tableのセルや文字の隙間を詰めて小さくする方法を解説します。
この記事を読む
【html/CSS】table内の文字を縦書きにする方法
2022年07月05日
「tableの一列目のヘッダーを縦書きにしたい！」table内の文字を縦書きにする方法を解説します。
この記事を読む
【CSS】tableの最初の行,最後の行,最初の列,最後の列の指定方法
2022年07月04日
tableの最初の行、最後の行、最初の列、最後の列の指定方法を解説します。
この記事を読む
【WordPress】編集画面のeditor-style.cssが効かない対処法6選
2022年07月03日
「WordPressでeditor-style.cssをアップロードしたら編集画面が明朝体になって全然効いてない!?」編集画面のeditor-style.cssが効かない原因と対処法6選を紹介します。
この記事を読む
【CSS/html】tableを角丸にする方法（コピペでOK）
2022年07月02日
「tableを角丸にしたいんだけど、うまくいかない！」tableを角丸にする方法を解説します。
この記事を読む
【CSS/html】table,tdで折り返し,改行させる方法
2022年06月30日
「tableからURLがはみ出る！」tableの中に(空白のない)長い半角英数の文字列があると、tableをはみ出したり、tdの幅を伸ばしてしまいます。table,tdで折り返し,改行させる方法を解説します。
この記事を読む
【CSS/html】table,tdの幅を文字に合わせる方法
2022年06月29日
「tableの一列目を文字に合わせたい！」tableの一列目（特定の列td）を文字に合わせる方法を解説します。
この記事を読む
【html/CSS】table,th,tdに背景色をつける方法
2022年06月28日
「tableに色をつけて目立たせたい！」「thとtdを色分けしたい！」table,th,tdに背景色をつける方法を解説します。
この記事を読む
【CSS】transformが効かない4つの原因と解決方法
2022年06月25日
transformを指定したのに回転してない!?」「transformを指定したら思った位置に行かない!?」transformが効かない4つの原因と解決方法を解説します。
この記事を読む
【CSS/html】inputテキストボックスの背景色を変える方法
2022年06月21日
「テキストボックスをグレーにして入力できることがわかるようにしたい！」テキストボックスの色を変える方法を解説します。
この記事を読む
【CSS/html】立体的に見えるグラデーションのボタンの作り方
2022年06月19日
「グラデーションを使って立体的に見えるボタンを作りたい！」「ボタンを立体的に見せて押したくなるようにしたい！」立体的に見えるグラデーションのボタンの作り方を解説します。
この記事を読む
【html/CSS】ボタンにマウスが乗ったら指マークにする方法
2022年06月17日
「inputのボタンとbuttonタグをマウスを乗せたら指マークに変わるようにしてクリックできることがわかるようにしたい！」ボタンにマウスが乗ったらマウスカーソルを指マークにする方法を解説します。
この記事を読む
【html/CSS】ボタンにアイコンをつける方法
2022年06月15日
「文字だけのボタンじゃなくてアイコンをつけてわかりやすくしたい！」ボタンにアイコンをつける方法を解説します。
この記事を読む
【html/CSS】ボタンを横並びで中央寄せ,右寄せにする方法
2022年06月14日
「修正するボタンと送信ボタンを横に並べて中央寄せにしたい！」 ボタンを横並びで中央寄せ,右寄せにする方法を解説します。
この記事を読む
【html/CSS/JS】ボタンを押したら表示/非表示させる方法
2022年06月13日
html,CSS,Javascript(JQuery)を使って、ボタンを押したら要素を表示/非表示させる方法を解説します。
この記事を読む
【CSS】画像(img)が親要素から はみ出るときの対処方法
2022年06月08日
親要素に合わせて画像を切り抜きたい!レスポンシブ対応のため親要素が縮んだらimgも縮んでほしい!IEで確認したら画像がはみ出てる!?角丸にしたいのに画像の四隅がはみ出る!画像(img)が親要素からはみ出るときの対処方法をケース別に紹介します。
この記事を読む
【html/CSS】クリックしたら色が変わるボタンの作り方
2022年06月06日
「ボタンを押したことがちゃんとわかるようにしたい」どのボタンをクリックしたかわかるようにしたい」クリックしたら色が変わるボタンの作り方を紹介します。
この記事を読む
【html/CSS】font-weightが効かない,太字にならない原因と解決方法
2022年06月05日
「bタグで囲ったのに太字にならない!?」「font-weightを指定したのに細字のまま!?」文字が太字にならない、font-weightやbタグが効かない原因と解決方法を解説します。
この記事を読む
【html/CSS】ボタンを太字にする方法
2022年06月03日
「ボタンを目立たせるために太字にしたい！」「buttonタグにbタグが効かないけどどうすればいいの？」ボタンを太字にする方法を解説します。
この記事を読む
【html/CSS】画像と文字のあるリンクボタンの作り方
2022年06月02日
「画像と文字を横に並べたボタンを作りたい！」「画像の下に文字を置いたボタンを作りたい！」画像と文字が横に並んでいるボタンと縦に並んでいるボタンそれぞれの作り方を解説します。
この記事を読む
【html/CSS】画像をリンクボタンにする方法
2022年06月01日
画像をリンクボタンにしたいけどどうやるの？imgをaタグで囲ってもクリック範囲が狭い!?広げたいんだけど!?画像(img)をリンクボタンにする方法を解説します。
この記事を読む
【html/CSS】aタグをボタンにするシンプルかつ基本的な方法
2022年05月31日
「aタグリンクをもっと目立つようにボタンにしたい！」aタグをボタンにする方法を紹介します。ここではシンプルかつ基本的な方法をCSSひとつひとつ丁寧に紹介します。
この記事を読む
【html/CSS】下線の太さ,色,種類を変える方法
2022年05月28日
「aタグの下線の色を変えたい！」「波線の下線を引きたい！」下線の太さ、色、種類を変える方法を解説します。
この記事を読む
【html/CSS】リンク(aタグ)の下線を消す/下線を引く方法【hover時も】
2022年05月27日
「aタグの下線がジャマだから消したい！」「でもマウスを乗せたときには下線を引きたい！」リンク(aタグ)の下線を消す/下線を引く方法を解説します。
この記事を読む
【html/CSS】aタグやspanなどインライン要素を横並びする方法
2022年05月26日
リンクを横に並べたい！行の右端じゃなく、インライン要素内で改行させたい！aタグやspanなどインライン要素を横並びする方法を解説します。
この記事を読む
【CSS/html】aタグの幅(width)を変える方法
2022年05月25日
「リンクの幅を広くしたい!」「aタグにwidthを指定したのに効かない!?」タグの幅(width)を変える方法を解説します。
この記事を読む
【CSS/html】aタグのフォントサイズを変える方法
2022年05月24日
「aタグを押しやすくするためにもっと大きくしたい！」aタグのフォントサイズを変える方法を解説します。
この記事を読む
【html/CSS】aタグを改行する、縦に並べる方法
2022年05月22日
「aタグ同士を縦に並べたい！」「aタグ内のテキストの途中で改行したい！」aタグ間やaタグ内で改行する（縦に並べる）方法を解説します。
この記事を読む
【html/CSS】imgやaタグなどインライン要素をブロック要素に変える方法
2022年05月21日
「aタグをブロック要素にしてクリック範囲を広げたい！」「spanにwidthを指定するためにブロック要素にしたい！」imgやaタグなどインライン要素をブロック要素に変える方法を解説します。
この記事を読む
【CSS】文字の位置を微調整する方法
2022年05月20日
「文字をもう少しだけ右にずらしたい！」「文字と文字の間をちょっとあけたい！」文字の位置を微調整する方法を解説します。
この記事を読む
【CSS】div,p,h1,ul,liなどブロック要素を右寄せする方法
2022年05月19日
divやp,h1,ul,liまたはdisplay:blockなどブロック要素を右寄せする方法を解説します。
この記事を読む
【CSS】画像を暗く、黒っぽくする方法
2022年05月18日
「黒っぽい」は黒く色が見えにくくなる状態で、「暗い」は明度が下がり濃くなったような状態です。CSSだけで画像を暗くする方法、黒っぽくする方法を解説します。
この記事を読む
【CSS】画像を明るく、白っぽくする方法
2022年05月18日
「白っぽい」は白く薄くなる状態で、「明るい」は光の量が強くなったような状態です。CSSだけで画像を明るくする方法、白っぽくする方法を解説します。
この記事を読む
CSSで乗算などができるmix-blend-modeの使い方
2022年05月17日
イラストレーターやフォトショップでおなじみの「合成モード」、実はCSSでも実現できるんです。CSSで乗算などができるmix-blend-modeの使い方を解説します。
この記事を読む
【CSS】width:calc(100%/3)で3分割しよう
2022年05月16日
「3分割したいけど100は3で割り切れないよ！」「calcを使いたいけどうまくいかない！」width:calc(100%/3)を使って3分割する方法を解説します。
この記事を読む
【html/CSS】幅(width)を子要素に合わせる方法
2022年05月15日
親要素がdivなどのブロック要素の場合、何もしないと横幅がいっぱいになります。親要素を子要素の幅に合わせましょう。
この記事を読む
【html/CSS】幅(width)を親要素に合わせる方法
2022年05月14日
子要素の幅を親要素に合わせたいのにピッタリ合わない!?子要素の幅(width)を親要素に合わせる方法を解説します。
この記事を読む
【html/CSS】横幅(width)を画面いっぱいにする方法
2022年05月13日
要素を画面いっぱいにしたいのにちょっと内側になってる！body直下じゃない要素の幅を画面いっぱいにしたい！横幅(width)を画面いっぱいにする方法を解説します。
この記事を読む
【CSS】liの点を位置を調整する方法
2022年05月09日
liの点の位置が気にくわない！少しずらしたい！liの点を位置を調整する方法を解説します。
この記事を読む
【CSS/html】inputを右寄せ,中央寄せ,左寄せする方法
2022年05月08日
テキストボックスを中央寄せしたいけどmargin:autoじゃ中央寄せにならないの？inputテキストボックスの位置、またはそのテキストを中央寄せ,右寄せ,左寄せする方法を解説します。
この記事を読む
【html/CSS】inputテキストボックスの枠線を消す方法
2022年05月07日
テキストボックスの線を消す方法とフォーカス時の枠線を消す方法を紹介します。
この記事を読む
【html/CSS】横線を引く方法【区切り線,divや文字の下線】
2022年05月05日
divに横線を引きたいんだけどどうやるの？文章中に区切り線を引きたい！文字に下線を引きたい！横線を引く方法をケース別に紹介します。
この記事を読む
【CSS】円(丸)を重たり二重丸にする方法（レスポンシブ対応）
2022年05月04日
「丸をちょっと重ねて、ちゃんとレスポンシブ対応もしたい！」円(丸)を重ねる方法を紹介します。レスポンシブ対応もしますよ！
この記事を読む
【CSS】position:absoluteで右寄せする方法
2022年05月03日
position:absoluteで左寄せする方法はわかるけど右寄せする方法がわからない！position:absoluteで右寄せする方法を解説します。
この記事を読む
【CSS】h1やthの太字を解除する方法
2022年05月02日
h1～h6は見出しタグ、thは表の見出しタグで、これらはデフォルトで太字になっています。太字はカッコ悪い！普通の太さにしたい！h1やthの太字を解除する方法を解説します。
この記事を読む
【CSS/html】ボタンの色を変える方法
2022年05月01日
htmlの標準のボタンは背景色が灰色で目立ちません。「でもボタンを目立たせたい！」CSSでボタンの色を変える方法を解説します。
この記事を読む
【CSS/html】ボタンに影をつける方法
2022年04月30日
ボタンに影を付けてかっこよく目立たせたい！ボタンに影をつける方法を紹介します。
この記事を読む
htmlのみで文字を装飾する方法（太字,下線,文字色,大きさ変更）
2022年04月28日
CSSはよくわからない！手早く簡単に文字を装飾したい！htmlのみで文字を装飾（太字・下線・文字色・大きさなど）する方法を紹介します。
この記事を読む
【CSS】角丸,丸いボタンの作り方【デザイン例あり】
2022年04月27日
「ボタンを角丸にして優しい印象を与えたい！」CSSで角丸ボタンを作る方法をデザイン例とともに紹介します。
この記事を読む
CSSで作るゲージのデザイン方法
2022年04月26日
ゲージはどのくらいの%なのかを直感的に示すことができます。「CSSでゲージをどうやって作るの？」CSSで作るゲージのデザイン方法を紹介します。
この記事を読む
【CSS】font-familyが効かない原因6つと解決方法
2022年04月25日
指定したフォントになってない！font-familyが効いてないよ!?font-familyが効かない原因6つと解決方法を紹介します。
この記事を読む
CSSでフォントをゴシック体・明朝体に指定する方法
2022年04月24日
ホームページは文字がいっぱいですが、その文字もできるだけ読みやすいフォントにしたいものです。CSSでフォントをゴシック体・明朝体に指定する方
この記事を読む
display:flexの親要素と子要素の関係
2022年04月22日
display:flexといえば横並びに使うCSSです。よく知らずに使うとうまく効きません。display:flexの親要素と子要素の関係を解説します。
この記事を読む
【CSS/html】tableのフォントサイズを指定する方法
2022年04月21日
「tableは幅が狭いから一回り文字サイズを小さくしたいtableのフォントサイズを指定する方法を解説します。
この記事を読む
【CSS/html】複数のtableを横並べする方法4選
2022年04月20日
tableが縦に並んじゃう！tableを2つ3つ横並べしたいんだけど！複数のtableを横並べする方法を4つ紹介します。
この記事を読む
【CSS/html】tableを点線にする方法
2022年04月19日
tableの線は普段実線にしますが、点線にする必要があることもあるでしょう。tableを点線にする方法を解説します。
この記事を読む
【CSS/html】子要素が親要素をはみ出す原因と解決方法【tableなど】
2022年04月18日
レスポンシブ対応したら横スクロールが発生している!tableが横に長くなって親要素からはみ出てる!tableなど子要素が親要素をはみ出す原因と解決方法を解説します。
この記事を読む
【CSS/html】tableの内側だけ線を引く方法
2022年04月17日
「tableの外側の線を消して、内側だけに線を引きたい！」tableの内側だけ線を引く方法を解説します。
この記事を読む
【CSS/html】table内のテキスト等を上下(縦)中央寄せする方法
2022年04月16日
「tableのテキストを上下(縦)中央寄せしたい！」table内のテキスト等を上下(縦)中央寄せする方法を解説します。
この記事を読む
【CSS/html】table内のテキストの行間を指定する方法
2022年04月15日
「table内のテキストは他のテキストより行間を狭くしたいんだよなぁ」table内のテキストの行間を指定する方法を解説します。
この記事を読む
【html/CSS】table,tdのalign属性の使い方【効かないときの対処法】
2022年04月14日
tableにalign指定したのに動かないよ～!?tableのalignの使い方とaligmが効かないときの対処法を解説します。
この記事を読む
【CSS】divを横並びにしつつ右寄せする方法4選
2022年04月13日
divとかを横並べにする方法はわかったけど左寄せじゃなくて右寄せにしたい！divを横並びにしつつ右寄せする方法を4つ紹介します。
この記事を読む
【CSS】flexで横並びの子要素を均等幅にする方法
2022年04月12日
display:flexを指定した子の幅は内容量に応じて伸び縮みします。子要素の数に関わらずdisplay:flexで横並びの子要素を均等幅にする方法を解説します。
この記事を読む
CSSでdiv,文字,画像を右下寄せする方法3選
2022年04月10日
「画像を右下に寄せるにはどうするの!?」CSSでdivや文字、画像を右下寄せする方法を3つ紹介します。
この記事を読む
【html/CSS】画像を右寄せ,中央寄せ,左寄せする方法
2022年04月09日
「画像を中央寄せしたい！右寄せしたい！」「画像の中央寄せができないんだけど!?」SSで画像を右寄せ,中央寄せ,左寄せする方法とそれができないときの注意点を解説します。
この記事を読む
【CSS】文字を中央寄せ,右寄せ,左寄せするtext-alignの使い方
2022年04月08日
文字を中央寄せするにはどうするの？文字を中央寄せ,右寄せ,左寄せするtext-alignの使い方を解説します。
この記事を読む
【html/CSS】空白文字(スペース)を作る方法
2022年04月07日
「文字と文字の間を空白スペースでちょっとだけ空けたい」「pタグの文頭だけ1文字分空白を空けたい」htmlやCSSで空白文字を作る方法を解説します。
この記事を読む
【CSS/html】inline-blockを改行する方法
2022年04月05日
inline-blockはどうやって改行するの？display:inline-blockを改行する方法を解説します。
この記事を読む
【CSS】display:inline-blockを中央寄せする方法
2022年04月04日
inline-blockが中央寄せできない!?display:inline-blockを中央寄せする方法を解説します。
この記事を読む
【CSS】display:flexで高さをそろえない方法
2022年04月03日
display:flexを指定すると子要素は親要素と同じ高さになります。子要素の高さをそろえない、それぞれの高さにする方法を解説します。
この記事を読む
【CSS】margin:autoとtext-align:centerの違いと使い分け
2022年04月02日
CSSで中央寄せするにはmargin:autoとtext-align:centerがありますが中央寄せできないことがあります。margin:autoとtext-align:centerの違いと使い分けを解説します。
この記事を読む
【html/CSS】横幅を固定する方法
2022年04月01日
「横幅が勝手に広がったり縮んだりしないように固定したい！」横幅を固定する方法を解説します。
この記事を読む
【CSS/html】tableのtd列幅を均等にする方法
2022年03月31日
「内容量に関わらず表の列幅を均等にしたい！」tableのtd列幅を均等にする方法を解説します。
この記事を読む
【html/CSS】tableの幅や高さを自動調整する方法
2022年03月30日
「tableの幅を自動調整したい！」「tableの幅を自動調整しないでほしい！」tableの幅を自動調整する方法としない方法を解説します。
この記事を読む
【html/CSS】tableの行ごとマスごとに幅を変える方法
2022年03月29日
tableは表を作ることができるhtmlタグです。これを使うことで行ごと、マスごとの幅をそろえることができます。tableの行ごとマスごとに幅を変える方法を解説します。
この記事を読む
HTML5におけるtableのwidthなど属性の代替CSS
2022年03月28日
html5ではそれまで使えていた多くの属性値が廃止となり属性が多かったtableは影響大です。HTML5におけるtableのwidthなど属性の代替CSSを解説します。
この記事を読む
【CSS】vwと%の違い、使用例
2022年03月24日
「vwも%も横を基準とする単位なんでしょ？何が違うの？」vwと%の違いとvwの使用例を解説します。
この記事を読む
【CSS】margin・paddingでのパーセントの使い方
2022年03月23日
widthの％は親の横幅、heightの％は親の高さを基準としますが、margin・paddingは注意が必要です。margin・paddingでのパーセントの使い方を解説します。
この記事を読む
spanやaタグのCSSやclassが効かない原因と解決方法
2022年03月22日
spanやaタグに指定したCSSが効かないことがあります。spanやaタグのCSSやclassが効かない原因と解決方法を解説します。
この記事を読む
【CSS】margin-top,-bottomが効かない原因と解決方法
2022年03月21日
margin-topとmargin-bottomはやっかいな特徴があり、思った通りの動きをしてくれないことがあります。margin-topとmargin-bottomが効かない原因とその解決方法を解説します。
この記事を読む
【CSS】マイナス(ネガティブ)marginの使い方・注意点
2022年03月19日
marginはマイナスの値を指定することができます。マイナス(ネガティブ)marginでは何ができるのか、どんなことに注意しなければならないのか解説します。
この記事を読む
【CSS】margin-left:autoで右寄せにする
2022年03月18日
「margin-left:autoで右寄せにできる」ということについて深堀りしていきます。
この記事を読む
【CSS】margin・paddingの初期値と解除方法
2022年03月17日
marginやpaddingって最初から指定されているけど、何にいくつ指定されているの？margin・paddingの初期値と解除方法を解説します。
この記事を読む
【CSS】上下のmargin:autoは効かない？仕様を解説！
2022年03月16日
marginの上下をautoにすると上下中央寄せにできるでしょうか？marginで上下をautoにしたときの仕様について解説します。
この記事を読む
【CSS/html】tableのborderの太さを変える方法
2022年03月15日
tableは表をつくるhtmlタグです。太さを太くしたいこともあるでしょう。tableのborderの太さを変える方法を解説します。
この記事を読む
【CSS/html】メニューの横に区切り線を付ける方法4種
2022年03月14日
横並びメニューは区切り線がなくても機能しますが、区切り線があることで誤クリックを減らすことができ、ユーザーにやさしいサイトになります。メニューの横に区切り線を付ける方法をデザインを変えて4種類紹介します。
この記事を読む
【CSS/html】tableの隙間をなくしてborderをくっつける方法
2022年03月11日
tableのtdにborderを指定するとセルごとのborderに隙間ができ、線がわかれてしまいます。tableの隙間をなくしてborderをくっつける方法を紹介します。
この記事を読む
CSSセレクタで次の要素の指定のしかた
2022年03月11日
CSSセレクタでは主に子要素、子孫要素への指定です。それ以外にも「次の要素」を指定することもできます。CSSセレクタで次の要素の指定のしかたを解説します。
この記事を読む
CSSの書く順番【セレクタ、プロパティごとに解説】
2022年03月08日
CSSは1行書けば終わりというものではなく、たくさん書く必要があります。「CSSってどんな順に書けばいいの？テキトーでいいの？注意点は？」CSSの書く順番をセレクタ、プロパティごとに解説します。
この記事を読む
【html/CSS】table,td(表)の文字を上寄せ,中央寄せ,下寄せする方法
2022年03月07日
ableは表として使うことができます。かし、通常文字が上下中央寄せになってしまいます。table,td(表)の文字を上寄せ、中央寄せ、下寄せする方法を解説します。
この記事を読む
【html/CSS】横並べした画像を上寄せ・下寄せにする方法
2022年03月06日
画像を横並べしたとき、画像の高さが異なると当然上寄せ、中央寄せ、下寄せのいずれかになります。その位置を任意で指定するために、横並べした画像を上寄せ・下寄せにする方法を紹介します。
この記事を読む
【CSS】画像(img)を親要素からはみ出させつつ中央寄せにする方法
2022年03月05日
画像が親要素からはみだすくらい大きいと「text-align:ceter」や「margin:auto」では中央寄せできません。画像を親要素からはみ出させつつ中央寄せにする方法を紹介します。
この記事を読む
CSSで画像に枠線をつける方法と枠デザイン例
2022年03月03日
画像をそのまま表示するんじゃなくて額縁をつけるように少し装飾したいですよね？「そもそも画像に枠線をどうやってつけるの？」CSSで画像に枠線をつける方法を4つとそれを応用した枠デザイン例を紹介します。
この記事を読む
【CSS/html】画像や背景画像を横幅いっぱいに拡大する方法
2022年03月01日
「画像を横幅いっぱいにしたい」「ブログ記事内の親の幅に画像を合わせたい」画像を横幅いっぱいに拡大する方法を解説します。レスポンシブ対応しています。
この記事を読む
【CSS/html】画像を縮小させても中央寄せさせる方法
2022年02月28日
画像が大きいときは中央寄せになっているのに、縮小するとちょっと左にずれるんだけど!?縮小しても真ん中に寄せたい！画像を縮小させても中央寄せさせる方法を解説します。
この記事を読む
【CSS】画像だけを中央寄せしてテキストは左寄せのままにする方法
2022年02月26日
テキストの前後にある画像を目立たせるために中央寄せしたいですよね？そう思って中央寄せしたらテキストごと中央寄せになってしまった!?画像だけを中央寄せしてテキストは左寄せのままにする方法を解説します。
この記事を読む
【html/CSS】間隔,隙間,余白,空白をあける方法
2022年02月22日
デザインにおいて間隔や隙間は非常に重要なものです。htmlやCSSで上下や左右の間隔・隙間をあける方法を紹介します。画像やdivの場合と、文字の場合でそれぞれ解説します。
この記事を読む
【CSS】align-items:centerが効かない原因と解決方法3選
2022年02月21日
align-itemsは縦位置を調整するCSSです。align-items:centerを指定すると縦の中央寄せになります。でも思った位置になってない？ずれている？効いていない？align-items:centerが効かない原因と解決方法を4つ紹介します。
この記事を読む
CSSを優先させる・優先度を上げる方法
2022年02月19日
CSSが効かない原因の一つにCSSの優先度が負けている、というものがあります。「じゃあどうやって優先度を上げるの!?」CSSを優先させる・CSSの優先度を上げる方法を解説します。
この記事を読む
【CSS】画像を中央寄せできない・真ん中にならない原因
2022年02月18日
「画像を中央寄せしたいのにできない！」「画像が真ん中にならない！真ん中からちょっとずれてる」画像を中央寄せできない原因と解決方法を、使ったCSS別に紹介します。
この記事を読む
htmlのみでボタン作成・デザインする方法【CSSなし！】
2022年02月17日
「CSSは使いたくない！htmlだけでボタンって作れないの!?」CSSを使わず、htmlのみでボタンを作る方法、そのデザインを任意に変更する方法を解説します。
この記事を読む
htmlのみの「ページトップへ戻る」の作り方【CSSなし！】
2022年02月17日
「CSSはよくわからない！そんな大げさなものじゃなくていいからhtmlだけでできないの!?」htmlのみでできる「ページトップへ戻る」の作り方を解説します。
この記事を読む
【CSS】レスポンシブやメディアクエリが効かない原因と解決方法9選
2022年02月11日
レスポンシブやメディアクエリ、@media screenが効かない原因と解決方法を、起こっている現象に合わせて9つ紹介します。
この記事を読む
ブログ記事がGoogle検索でまったくヒットしない原因と対処方法7選
2022年02月08日
「ホームページやブログで記事を作ったのにGoogleでまったくヒットしない!?」「サーチコンソールで確認したら記事の表示回数がゼロ!?」ブログ記事がGoogle検索でまったくヒットしない原因と対処方法を7つ紹介します。
この記事を読む
【html/CSS】idやclassの指定が効かない原因6選
2022年02月07日
htmlにidやclassを指定すると任意のCSSが指定できます。しかし、idやclassは間違えやすい要素の一つです。idやclassの間違えやすいポイントを6つ紹介します。
この記事を読む
【CSS】line-heightが効かない原因と解決方法4選
2022年02月06日
line-heightは行間を調整するCSSです。「line-heightを指定したのに行間が変わらない!?」ine-heightが効かない原因と解決方法を4つ紹介します。
この記事を読む
【CSS】background-sizeが効かない原因と解決方法5選
2022年02月03日
background-sizeを指定したのに画像の大きさが変わらないよ!?backgroundまでは効いていたのにbackground-sizeを指定したら画像が表示されなくなった!?background-sizeが効かない原因と解決方法を5つ紹介します。
この記事を読む
【CSS】clear:bothが効かない原因と解決方法
2022年02月02日
clear:bothは主にfloatとセットで使うCSSです。これを使うとfloatの効果をリセットできます。「clear:bothを使ったのにfloatが変になってる!?効いてないの!?」 clear:bothが効かない原因と解決方法を解説します。
この記事を読む
【CSS】orderが効かない原因と解決方法3選
2022年01月31日
「orderを使うと要素の並び替えができるって聞いたのに並び替えできないよ!?」orderが効かない原因と解決方法を3つ解説します。
この記事を読む
selectのoptionに効くCSSと効かないCSS
2022年01月29日
optionはselectの中に作る選択肢一つ一つを囲うhtmlタグです。selectはCSSがよく効きますが、optionは多くのCSSが効きません。optionに効くCSSと効かないCSSについて解説します。
この記事を読む
【CSS】height:100%やautoが効かない理由
2022年01月27日
height:100%やautoにしても高さいっぱいにならないのなんで?高さが0になってるのなんで?height:100%やautoが効かなかったり、高さが0になる理由を解説します。
この記事を読む
【CSS】floatが効かない（横並びにならない）原因と解決方法
2022年01月26日
float:leftを使うと要素を横並べできます。でもfloat:leftを使ったのに横並べできてない!?CSSのfloatが効かない（横並びにならない）原因と解決方法を解説します。
この記事を読む
【CSS】font-sizeが効かない、変わらない原因
2022年01月25日
「思った通りの文字サイズにならない!?」font-sizeを指定しても文字サイズが変わらない原因と対応方法を解説します。
この記事を読む
html・CSSで赤字（赤文字）にする方法
2022年01月21日
重要な箇所は赤字にして強調したい！赤字にするにはどうするの!?html・CSSで赤字にする方法を解説します。
この記事を読む
【html・CSS】labelタグ内で改行する方法
2022年01月20日
labelの中の文字はbrで改行できます。しかし、ただ改行すると一行目と二行目の文頭がそろいません。labelタグ内で改行して文頭をそろえる方法を解説します。
この記事を読む
【CSS】borderの長さを文字に合わせる方法
2022年01月16日
divなどのブロック要素にborderを指定すると横幅いっぱいの長さになってしまいます。下線を文字の長さに合わせるにはどうすればいいの!?borderの長さを文字に合わせる方法を解説します。
この記事を読む
【html】画像(img)のaltが表示されない理由と対応方法
2022年01月10日
「画像にマウスを乗せてもaltのテキストが表示されない!?なんで!?」画像(img)のaltが表示されない理由と対応方法を解説します。
この記事を読む
【CSS/html】divなどの要素を重ねる方法3選
2022年01月09日
divとdivを重ねたいんだけどどうやるの？position: absoluteを使わず少しだけ重ねたい！CSSでdivなどの要素を重ねる方法を3つ紹介します。
この記事を読む
【html/CSS】aタグを中央寄せする方法
2022年01月04日
aタグは通常左寄せになっています。これを中央寄せするには一工夫必要です。aタグ（リンク）を中央寄せする方法を解説します。
この記事を読む
CSSでliを縦並びにする方法
2022年01月01日
横並びになっているliを縦並びにする方法を解説します。
この記事を読む
【CSS】before・afterで四角を作る方法
2021年12月30日
アイコンとして四角を使いたい！画像を使わず、before・afterで四角を表現したい！before・afterで四角を作る方法を解説します。
この記事を読む
【CSS】beforeとafterの順番
2021年12月29日
beforeとafterってどっちが先だっけ？beforeとafterの順番を入れ替えるにはどうするんだっけ？beforeとafterの順番を解説します。
この記事を読む
【CSS】before・afterを3つ以上複数使えるか？
2021年12月28日
before・afterの2つじゃ足りない！3つ以上複数使いたいのだが!?疑似要素に疑似要素の指定は可能なのか？before・afterを複数(3つ以上)使えるか？
この記事を読む
【CSS】before・afterを重ねる方法
2021年12月27日
before・afterでアイコンを作って要素に重ねるのはどうやるんだっけ？before・afterを重ねる方法を解説します。
この記事を読む
【CSS】border線を途中から変える方法
2021年12月22日
全体の線はborderで指定できます。ただ、かっこいいデザインをするために下線を途中から変えたいこともありますね。border線を途中から変える方法を解説します。
この記事を読む
【html/CSS】divやtableのborder(枠線)に色をつける方法
2021年12月18日
tableの線の色を変えたいけどどうやるんだろう？border(枠線)に色をつける方法を解説します。
この記事を読む
inline-blockで横並びする方法【横並びにならない対処法】
2021年12月17日
display:inline-blockで横並びさせたいのに横並びにならない!display:inline-blockで横並びする方法する方法とそれがが効かない・横並びにならない原因と解決方法を4種類解説します。
この記事を読む
【CSS/html】table,tdの余白の指定方法【内側･外側･セル間隔】
2021年12月15日
tableの外側の余白を指定したい。セルの内側の余白をあけたい。table,tdの余白の完全解説します。
この記事を読む
【html/CSS】tableやtrのborder(枠線)が表示されない原因6選
2021年12月14日
tableの一部の線が表示されてない!?tableのborderが一部・全部表示されない原因を6つ紹介します。
この記事を読む
【CSS/html】tableのヘッダを固定してスクロールさせる方法
2021年12月13日
tableをスマホ画面のように小さな範囲で見せるにはスクロールさせるしかありません。tableのヘッダを固定して縦横スクロールさせる方法を解説します。
この記事を読む
【html/CSS】tableの高さheightの指定方法【効かない原因と解決方法】
2021年12月12日
tableに高さを指定したいけどどうやるの？tableにheightを指定したのに効かないんだけど!?tableの高さの指定方法およびheightが効かない原因と解決方法を解説します。
この記事を読む
【CSS】tableの奇数行,偶数行・奇数列,偶数列の指定方法
2021年12月11日
表の奇数行と偶数行の色を変えたい！tableの奇数行・偶数行、奇数列・偶数列を指定する方法を紹介します。
この記事を読む
【html/CSS】tableの二重線を一本線にする方法
2021年12月10日
htmlでtableを作成すると二重線になってしまいますよね。「二重線じゃ気持ち悪い！一本線にしたい！」tableの二重線を一本線にする方法を解説します。
この記事を読む
CSSでサイト全体を中央寄せする方法
2021年12月09日
サイトは何もしないと左寄せになっています。しかし、今どき左寄せになっているサイトはまずありません。CSSでサイト全体を中央寄せする方法を解説します。
この記事を読む
【CSS/html】flexとtableの違い【似て非なる2つ】
2021年12月09日
flexとtableは何が違うの？どう使い分ければいいの？横並びできるという点は似ているflexとtableの違いを見ていきましょう。
この記事を読む
CSSをページごとに変える方法
2021年12月06日
各ページ違うデザインにしたい場合もあるでしょう。CSSをページごとに変える方法を紹介します。
この記事を読む
【CSS/html】ページ全体の背景色を指定する方法
2021年12月02日
ページの背景色を白以外の色に変えたい！ページごとに背景色を変えたい！CSSでページ全体の背景色を指定する方法を解説します。
この記事を読む
【CSS】現在の幅をピクセルで調べる方法
2021年11月28日
ここの幅何pxに設定されているんだろう？%指定したけど実際のところ今何pxなんだ？現在の幅をピクセルで調べる方法を解説します。
この記事を読む
パンくずリストの作り方【コピペ可】
2021年11月24日
パンくずリストの作り方を解説します。
この記事を読む
CSSで要素を斜めにする方法
2021年11月23日
直角は簡単にできるんだけど斜めってどうやるの？CSSを使って要素を斜めにする方法を解説します。
この記事を読む
一部または全部のCSSを一時的に無効にする方法
2021年11月21日
一部または全部のCSSを一時的に無効にする方法を紹介します。複数の方法を紹介しますので状況に応じて使い分けてください。
この記事を読む
【html/CSS】虹色の作り方【背景・文字・アニメーション】
2021年11月20日
CSSで虹色の作り方と虹色のカラーコード、グラデーションの虹色、虹色の文字、虹色をアニメーションで動かす方法などを解説します。
この記事を読む
【CSS】いろいろなチェックマークの作り方【トンガリ･角丸･アニメ】
2021年11月17日
CSSで四角,トンガリ,角丸のチェックマークとそれらのアニメ版、さらにチェックボックスをチェックマークにする方法を解説します。コピペでOKです。
この記事を読む
CSSで子要素の高さを親要素に合わせる方法3選
2021年11月15日
横並びしている要素の高さがばらついているから親要素の高さに合わせたい！CSSで子要素の高さを親に合わせる方法を解説します。
この記事を読む
【html/CSS】高さ(height)を画面いっぱいにする方法
2021年11月14日
高さを画面いっぱいにしたいのに方法がよくわからない！height:100%じゃ効かない！CSSで高さを画面いっぱいにする方法を解説します。
この記事を読む
border-collapse・border-spacingが効かない原因と解決方法
2021年11月12日
「border-spacingを指定しているのに隙間ができない!?」border-collapse・border-spacingが効かない原因と解決方法について解説します。
この記事を読む
【CSS】ボタンの上にボタンを重ねる方法
2021年11月10日
「ボタンの上にボタンを置こうと思ってaタグ内にaタグを置いたところ、崩れてしまった！どうやればボタンの上にボタンを重ねられるんだ!?」CSSでaタグのボタンの上にaタグのボタンを重ねる方法を解説します。
この記事を読む
【CSS/html】画像の上に画像を重ねる方法【レスポンシブ対応】
2021年11月09日
htmlやCSSで要素を重ねるというのは少し難しいものです。画像の上に画像を重ねる方法を3つ紹介します。
この記事を読む
CSSで送信ボタンを指定、デザインする方法
2021年11月08日
送信ボタンをCSSで調整する方法、送信ボタンはどんなデザインがいいのかを解説します。
この記事を読む
【html･CSS】四角で囲む方法【囲み枠の調整】
2021年11月06日
デザインの基本中の基本「四角」。四角で囲み、配置ができればサイトの大枠はできてきます。四角で囲む方法やその幅、位置、枠線の調整方法について解説します。
この記事を読む
CSSの1行や複数行でのコメントアウト
2021年11月03日
PHPの一行コメントアウトである「//」や「#」で、CSSも一行コメントアウトできるのでしょうか？
この記事を読む
【CSS】cursor一覧とinputでの使い方
2021年11月02日
inputのラジオボタンやlabelはマウスを乗せても指のアイコンになりません。クリックできることがわかるようにアイコンを変えたいですね。cursor一覧とラジオボタンなどのinputやlabelでの使い方を紹介します。
この記事を読む
【CSS】薄いグレー･濃いグレーのカラーコードと名前
2021年10月23日
「薄いグレーを使いたいけど名前なんだっけ？」グレーの名前とカラーコードの覚え方を解説します。
この記事を読む
CSSのアスタリスクの意味・使い方【アスタリスクは4種類】
2021年10月22日
CSSではアスタリスクには4つの意味があります。4種類のアスタリスクの意味、使い方を解説します。
この記事を読む
【CSS/html】文字や画像を90度回転する方法【注意点も解説】
2021年10月21日
縦に撮った写真画像を90度回転させて横にしたい！文字を縦にしてスタイリッシュにしたい！CSSで文字や画像を90度、45度回転する方法を解説します。
この記事を読む
CSSでX軸Y軸の移動方法
2021年10月19日
CSSでX軸とY軸を指定して移動させるのってどうやるんだっけ？X軸Y軸の移動方法を解説します。
この記事を読む
【CSS】flexで逆順、逆並びにする方法
2021年10月18日
flexで並び順を逆にするにはどうやるんだっけ？display:flexで並び順を変える、逆にする方法を解説します。
この記事を読む
floatはもう古い!?flexとfloatの違い,使い分け,併用方法を解説
2021年10月16日
floatは崩れやすくCSS初心者が失敗しやすいCSSの一つです。display:flexとfloatの違い、使い分け、併用方法を解説します。
この記事を読む
【CSS】flexで両端、左右に分ける方法【3つ以上も可能】
2021年10月15日
「3つ以上横並べしたときはどうやって左右に分けるの？」display:flexで両端、左右に分ける方法を解説します。
この記事を読む
【CSS/html】flexにborderで枠線や区切り線を付ける方法
2021年10月13日
display:flexで横並びした要素に枠線･罫線をつけて、線の重なりを解消する方法を解説します。
この記事を読む
【CSS】flexで子要素の間隔を調整する方法
2021年10月12日
「flexで子要素を横並べできたけど少し間隔をあけたい！」flexで子要素の間隔・余白・空白を調整する方法を解説します。
この記事を読む
【CSS】display:flexで上寄せ・下寄せする方法
2021年10月11日
「flexで横並べしたら全部同じ高さになった！上寄せしたい！」display:flexで上寄せ・上下中央寄せ・下寄せする方法を解説します。
この記事を読む
【CSS】display:flexで右寄せする方法(全部または一部)
2021年10月09日
「flexで最後の1つだけ右寄せしたい！」display:flexで全部または一部を右寄せする方法を解説します。
この記事を読む
【CSS】display:flexで中央寄せする方法（左右中央・上下中央）
2021年10月08日
dispaly:flexで横の左右中央寄せ、縦の上下中央寄せする方法を解説します。
この記事を読む
【html/CSS】1本の斜め線を引く方法
2021年10月02日
htmlやCSSにおいて斜め線を引くには工夫が必要です。斜め線を引く方法を２つ、手順も丁寧に紹介します。
この記事を読む
CSSセレクタの「+」プラスの使い方
2021年10月01日
+プラスってなんだ？どんなときに使うんだ？CSSセレクタ「+」プラスの使い方を使用例とともに解説します。
この記事を読む
CSSセレクタで子要素の指定方法
2021年09月30日
子要素の指定方法を覚えるとクラスは最低限にできます。CSSセレクタで子要素の指定方法を解説します。
この記事を読む
【html/CSS】枠の幅(width)を文字数に合わせる方法
2021年09月28日
「右のスペースが無駄だから文字数に合わせて幅を狭くしたい！」htmlやCSSで枠の幅(width)を文字数や中身に合わせる方法を解説します。
この記事を読む
html・CSSでボタンの文字サイズを変更する方法
2021年09月27日
ボタンを押しやすく、目立たせるために文字サイズを大きくしたいことがあります。html・CSSでボタンの文字サイズを変更する方法を解説します。
この記事を読む
【html/CSS】tableの枠線borderを全部・一部消す方法
2021年09月26日
tableのデザインによっては枠線がいらなくて消したいことがあります。tableの枠線を消す方法を解説します。全部消す方法、一部消す方法があります。
この記事を読む
CSSのグラデーションで2色、3色を指定する方法
2021年09月25日
グラデーションは当然1色ではなく、2色、3色と指定するものです。CSSのグラデーションで2色、3色、4色を指定する方法を解説します。
この記事を読む
【CSS】グラデーション(linear-gradient)で角度,方向を指定して斜めにする方法
2021年09月16日
グラデーションの方向を変えるために角度の指定をしたいものです。CSSでグラデーションの斜めの角度を指定する方法を解説します。
この記事を読む
【CSS】行間を下だけ、上だけ調整する方法
2021年09月15日
「上下の行間をあけたい！」「上下の行間を詰めて0にしたい！」行間を下だけ、上だけ調整する方法を解説します。
この記事を読む
【html/CSS】行間を詰めたり広げる,上下の文字間隔を調整する方法
2021年09月14日
行間が狭かったり、広かったりでどうも読みづらいことがあります。CSSで行間を詰めたり広げる方法を解説します。
この記事を読む
CSS displayの初期値・デフォルト(ブラウザでの初期値)
2021年09月13日
ブラウザ側でhtmlタグごとにdisplayの初期値が設定されており、dispalyの値を元に戻したいとき、意外とわかりません。CSS displayの初期値・デフォルトを解説します。
この記事を読む
【CSS】透明・半透明のカラーコード
2021年09月12日
「有色の指定方法はわかるけど、透明や半透明ってどうやって指定するんだろう？」CSSでcolor(色)を透明や半透明にする方法を解説します。
この記事を読む
【CSS】colorが効かない/文字色が変わらない原因と修正方法
2021年09月11日
CSS colorが効かない/文字色が変わらない原因と修正方法を解説します。
この記事を読む
【html/CSS】ul liの「・」点を消す方法
2021年09月10日
liにある「・」点がジャマですね。CSSでul liの点を消し、左寄せにする方法を解説します。
この記事を読む
【CSS】ul liの入れ子のデザイン紹介
2021年09月09日
ul liでメニューを作ることはよくあります。さらにサブメニューがあるときliの中にさらにul liを入れることになります。CSSでul liが入れ子の横並びサブメニューありデザインについて解説します。
この記事を読む
html･CSSで「※」米印（注釈）をつける方法4選
2021年09月08日
「米印ってどうやってつければいいんだろう？」html･CSSで「※」米印（注釈）をつける方法を4つ紹介します。ul liやtable、text-indent、beforeなどを使います。
この記事を読む
【html/CSS】ul liのメニューを横並びにする方法
2021年09月06日
メニューを横に並べたいのにul liは通常縦並びです。ul liを横並び2列にする方法を丁寧に解説します。
この記事を読む
CSSでcellspacing･cellpaddingを指定する方法
2021年09月04日
tableではcellspacingやcellpadding属性で隙間を調整できます。これらはhtmlだけではなくCSSで調整することができます。CSSでtableのcellspacing･cellpaddingを指定する方法、効かない原因を解説します。
この記事を読む
【html/CSS】tableを右寄せする方法
2021年08月21日
「tableを中央寄せや右寄せするにはどうするんだろう？htmlだけでできるかな？」html･CSSでtableを位置調整する方法を解説します。
この記事を読む
【html･CSS】table･tdの幅(width)の仕様と指定方法
2021年08月19日
tableやtdの幅って縮んだり伸びたり、指定した通りの幅にならなかったりとよくわからないですよね？table･tdの幅の仕様と調整方法についてまとめました。
この記事を読む
【CSS/html】tableの枠線を指定する方法
2021年08月17日
tableにはborder属性で線をつけることができます。しかし、その状態では二重線になっていてすっきりしないデザインの表になってしまいます。CSSでtableの枠線(border)を指定する方法を解説します。
この記事を読む
【CSS】tableをレスポンシブで縦並びにする方法
2021年08月16日
「パソコンではtableを使って横並べにしたいけど、スマホでは横幅が足りないからいっそ縦並びにしてしまいたい！」CSSでtableを分解して縦並びにする方法を解説します。レスポンシブ対応です。
この記事を読む
【CSSだけ】トップに戻るボタンの作り方【コピペでOK】
2021年08月14日
「トップに戻るボタン」は便利なものですが、その作り方や右下に固定する方法など意外とわからないものです。トップに戻るボタンをCSSで右下に固定する方法を解説します。コードはコピペでOKです。
この記事を読む
CSSでborderを二重線にする方法４種
2021年08月13日
「二重線のボタンを作りたい！」「二重線をデザインしたい！」CSSでborderを二重線にする方法を4種類紹介します。目的や条件に応じて適切なものを利用してください。
この記事を読む
CSSでボタンを透明や半透明にする方法
2021年08月12日
「ボタンの上にマウスが乗ったときに透明や半透明にしたい。でも透明ってどうやるんだ？」CSSでボタンを透明や半透明にする方法を解説します。
この記事を読む
html･CSSで横並びボタンの間隔･隙間を調整する方法
2021年08月11日
フォームなどで「戻る」「送信」のようにボタンが並んでいることがあります。しかし、CSSで調整しないと間隔がなく見にくいです。html･CSSで横並びボタンの間隔･隙間を調整する方法を解説します。
この記事を読む
CSSでボタン内の文字を中央寄せにする方法
2021年08月10日
「ボタンを作ったけど文字が左上にぴったりくっついていてバランスが悪い。文字をボタン内で中央寄せしたいけどどうやるの？」CSSでボタン内の文字を左右中央、上下中央寄せにする方法を解説します。
この記事を読む
【html･CSS】画像の上にボタンを重ねる方法
2021年08月09日
画像を置き、その上にボタンを重ねたいときありますよね。html・CSSで画像の上にボタンを重ねる方法を解説します。
この記事を読む
CSSでボタンを上下左右中央寄せにする方法２種
2021年08月08日
「ボタンを左右中央寄せにする方法はわかったけど、上下中央寄せにするにはどうやるんだろう？」CSSでボタンを上下左右中央寄せにする方法を解説します。
この記事を読む
【CSS/html】ボタンの枠線の有無,色,太さを調整する方法
2021年08月06日
ボタンを設置したのはいいものの枠線がどうも気になる。CSSでボタンの枠線の色や太さを変えたり、消す方法を解説します。
この記事を読む
【CSS】hover時ボタンや画像をopacityで半透明にする方法
2021年08月05日
ボタンや画像をhover時opacityで半透明にする方法を解説します。黒く透過させる方法、アニメーションさせる方法も紹介します。
この記事を読む
CSS position:absoluteで複数の要素を動かす
2021年08月04日
position:absoluteは要素を任意に移動できるCSSです。基準となる親要素にposition: relativeを指定して動かします。しかし、その子要素が複数あったとき、複数の要素をposition:absoluteで動かせるのか？CSS position:absoluteで複数の要素を動かすことについて解説します。
この記事を読む
position:absoluteの親要素を解説【親要素を無視・はみ出す】
2021年08月03日
position:absoluteは要素を任意の位置に移動でき、便利なCSSです。しかし、基準についてや、親要素を無視したり、はみ出さないようにするというのは意外と難しいのではないでしょうか。CSS position:absoluteの親要素を解説します。
この記事を読む
CSS position:absoluteのレスポンシブ・ずれるときの対応方法
2021年08月02日
正しくレスポンシブ対応させないでpositionを使うとずれてしまうことがあります。CSS position:absoluteのレスポンシブ・ずれるときの対応方法を解説します。
この記事を読む
【CSS/html】画像の位置を調整する方法
2021年08月01日
「画像をもう少しだけ右に移動させたい！」「画像を中央寄せにしたい！」画像の位置を調整する方法をケースにわけて紹介します。
この記事を読む
CSS positionの相対位置、絶対位置を解説
2021年07月31日
「positionで相対位置とか絶対位置とか聞くけどなんなの？どういう意味？」CSS positionの相対位置、絶対位置を解説します。
この記事を読む
CSSのborder-radiusで上だけ、左だけ、下だけ角丸にする方法
2021年07月30日
「border-radiusで全部の角じゃなくて左上と右上だけ角丸にしたい！」CSSのborder-radiusで上だけ、左だけ、下だけ角丸にする方法を解説します。
この記事を読む
CSSの記号一覧 #.>+~$@など 23種の記号の意味を徹底解説！
2021年07月29日
.ピリオド、#シャープ、>大なり、+プラス、~チルダ、$ドル、@アットなど、CSSに登場する23種類の記号の意味を徹底的に解説します！
この記事を読む
CSSの「#」シャープと「.」ドットの意味、違いは？
2021年07月28日
#や.はどういう意味？どう違ってどう使い分けるの？CSSの「#」シャープと「.」ドットの意味と違い、使い分けを解説します。
この記事を読む
inputのtypeでCSSを指定する方法【ラジオボタン、テキストボックスなど】
2021年07月27日
inputももちろんCSSで調整することができます。しかし同じinputでもラジオボタンとテキストボックスでは形がまったく違い、別のCSSを指定したいところです。ラジオボタン、テキストボックスなどCSSセレクタでinputを指定する方法を解説します。
この記事を読む
【CSS/html】aタグ(リンク)の色を変えない方法
2021年07月26日
「リンクの色を文字の色と同じにしたいんだよな」「訪問後のリンクの色を変化させたくない」CSSでaタグ(リンク)の色を変えない方法を解説します。
この記事を読む
【CSS】aタグのクリック範囲を親要素いっぱいに広げる方法
2021年07月25日
liを使ってメニューを作るときはliいっぱいにaタグが広がってほしいですよね？CSSでaタグのクリック範囲を親要素いっぱいに広げる方法を解説します。
この記事を読む
【html/CSS】画像サイズを自動調整で親の幅に合わせる方法
2021年07月23日
「画像を枠に合わせていちいち調節するのがメンドウ」CSSにて比率を維持して画像サイズを自動調整で親の幅に合わせる方法を解説します。
この記事を読む
html･CSSで画像の上に文字を真ん中に重ねる方法(レスポンシブ対応)
2021年07月22日
CSSで画像の上に文字を重ねて中央や左下に置く方法を解説します。もちろんレスポンシブ対応です。
この記事を読む
imgのwidthが効かない･画像を縮小できない原因7選
2021年07月21日
CSSやhtmlでimgのwidthが効かない･画像のサイズが変わらない原因と解決方法を7つ紹介します。画像を縮小できないのはwidthが効いていないということですので画像を縮小できなくて困っているかたも見ていってください。
この記事を読む
html･CSS ラジオボタンを横並びや縦並びにする方法
2021年07月20日
ラジオボタンやチェックボックスは横に並べると選択しやすいものですが、何も考えず設置するとかえって選択しにくい場合があります。html･CSSでラベルやラジオボタン、チェックボックスを横並びや縦並びにする方法を解説します。
この記事を読む
justify-contentが効かない5つの原因と解決方法
2021年07月19日
justify-content:space-betweenやjustify-content:centerが効かない原因と解決方法を5つ紹介します。
この記事を読む
CSSで横並びしたときの最後のmarginをなくす方法
2021年07月18日
横並びをしてその隙間をあけるためにmargin-rightなどで隙間を空けますよね？でもそうすると右側にいらない隙間ができてしまいます。これを解消するCSSで横並びしたときの最後のmarginをなくす方法を解説します。
この記事を読む
【CSS】divをflexで2段以上の横並びをする方法
2021年07月17日
「wordpressで記事一覧を出力して、それを複数行の横並びにしたい！」divをflexで2段以上の横並びをする方法を解説します。
この記事を読む
【CSS/html】文字やdivを下揃えする方法４選
2021年07月16日
「テキストやdivを下揃えにしたいんだけどどうやるの？」 CSSで文字やdivを下揃えする方法を4つ紹介します。
この記事を読む
html･CSSで横スクロールする方法（flex・div・table）
2021年07月15日
html･CSSで横スクロールする方法を紹介します。flexやtable、divを使った方法です。
この記事を読む
CSSで横並びしつつ上下中央寄せにする方法
2021年07月14日
「要素を横並べしつつ上下中央寄せしたいんだけど、どうやるんだろう？」CSSで横並びしつつ上下中央寄せにする方法を解説します。
この記事を読む
CSS display:flex以外で横並びする方法
2021年07月13日
最近の横並べと言えばdisplay:flexですが、古いブラウザなどで使えないことがあります。どうしても古いブラウザにも対応させないといけないときなどに使える、display:flex以外で横並びする方法を紹介します。
この記事を読む
【CSS】flexで横並びの高さを揃える方法【divやliも可】
2021年07月12日
「横並びしてさらに高さをそろえたい！」CSS display:flexで横並びの高さを揃える方法について解説します。
この記事を読む
CSS box-shadow（影）を解除・消す方法
2021年07月11日
「box-shadowで指定した影を解除して消したいけどどうやるんだろう？」CSS box-shadowを解除・消す方法を解説します。
この記事を読む
CSS borderの解除方法
2021年07月10日
「borderの一部を解除して線のない状態にしたい！」CSS borderの解除方法を解説します。
この記事を読む
CSS overflow:hiddenの解除・打ち消す方法
2021年07月09日
floatの回り込みを解除するためのoverflow:hiddenについてと、「overflow:hidden」そのものの解除について解説します。
この記事を読む
CSSの中央寄せを解除･初期化し左寄せに戻す方法
2021年07月08日
「パソコン版では中央寄せにしていたけどスマホでは解除して左寄せに戻したい」CSSの中央寄せを解除･初期化し左寄せに戻す方法を解説します。
この記事を読む
max-width、min-width、widthの解除方法･初期値
2021年07月07日
width,max-width,min-width,height,max-height,min-heightの解除方法･初期値を解説します。
この記事を読む
CSSを解除･初期値に戻す方法【3選】
2021年07月06日
「パソコン版で指定したCSSをスマホ版で解除したい。初期値に戻したいけどどうすればいいの？」そんなCSSを解除･初期値にする方法を3つ紹介します。
この記事を読む
CSSのbefore、afterを消す方法
2021年07月05日
CSSにおいてbefore、afterは非常に便利でよく使う技の一つです。しかし、スマホのとき解除したい、消したくても意外とその方法がわからないのではないでしょうか？CSSのbefore、afterを消す方法を解説します。
この記事を読む
【CSS】tableの枠線を下だけ、横線だけ引く方法
2021年06月28日
「表全体の線じゃなくて下線だけ引きたいんだけどどうすればいいんだろう？」CSSを利用して表（table）に下線を引く方法を解説します。
この記事を読む
CSS table,td,divなどwidthが効かない原因と解決方法
2021年06月17日
CSS widthが効かない原因と解決方法についてtable,td,div,a,span,flex,li,imgタグとhtmlタグケース別に解説します。max-width,min-widthが効かない理由も解説します。
この記事を読む
【CSS】PCのみ、スマホのみで表示する方法
2021年06月13日
スマホ対応させるとき特定の要素を消して表示させたくないときありますよね。「でも、PC･スマホで要素の表示・非表示の切り替えってどうやるんだろう？」そんなCSSでPC･スマホのとき要素を表示しない方法を解説します。
この記事を読む
【CSS】padding:autoで中央寄せできるのか解説
2021年06月12日
中央寄せといえば「margin:auto」ですね。marginとよく似たCSSである「padding」でも同じように中央寄せできないのだろうか？CSS paddingで中央寄せできるのか解説します。
この記事を読む
navやul liで横並べしつつ中央寄せ【レスポンシブ対応】
2021年06月11日
navやulを使ってメニューを作ることがあるでしょう。そしてそのメニューを横並べしつつ中央寄せしたいのでしょう。navやul liで横並べしつつ中央寄せし、さらにレスポンシブ対応する方法を紹介します。
この記事を読む
html･CSSで表テーブル(table)を中央寄せ(center)にする方法
2021年06月10日
html･CSSで表テーブル（table）を中央寄せ(center)にする方法と中央寄せできないワケを解説します。
この記事を読む
CSS flexで改行、折り返しさせる方法３選
2021年06月08日
flexは初期状態では改行されません。CSS display:flexで改行させる方法を3つ紹介します。
この記事を読む
CSS importantが非推奨と言われるワケ
2021年06月06日
importantが非推奨とされ使われない理由、importantの代替手段として優先順位を上げる方法、importantを推奨する場面について解説します。
この記事を読む
CSSのborderの太さ・長さを変える方法
2021年06月04日
borderの太さや長さ変えるにはどうするんだろう？CSSのborderの太さ・長さを変える方法について解説します。
この記事を読む
html･CSSでボタンのサイズ･大きさを変更する方法
2021年06月03日
htmlのinputボタンやbuttonタグのボタンのサイズを変更したい。html･CSSでボタンのサイズ･大きさを変更する方法を解説します。
この記事を読む
【html/CSS】ボタンの位置を中央寄せや右寄せにする方法６選
2021年05月31日
html･CSSで位置調整のため、ボタン･画像･テキスト、divを右寄せや中央寄せにする方法を6種類解説します。ボタンのa、button、inputの中央寄せ、右寄せ可能です。
この記事を読む
CSS importantを上書きする方法
2021年05月30日
外部のスタイルシートにimportantの記述があるが邪魔だから上書きしたい！ということがあることでしょう。CSS importantの上書きについて解説します。
この記事を読む
CSS positionにおけるleftやtopの解除方法
2021年05月29日
position:absoluteを使うと要素を任意の位置に動かすことができます。しかし、スマホ対応するときに解除させたいときがありますよね？ CSS positionにおけるleftやtopの解除方法を解説します。
この記事を読む
CSS position:absoluteやfixedの基準点がどこか解説！
2021年05月25日
positionは基準点から任意にずらせるCSSです。しかしそもそも基準点はどこなのか？positionの基準点がどこか解説していきます。
この記事を読む
【CSS/html】divの背景色を塗りつぶす方法
2021年05月22日
CSSを使って塗りつぶしたいけど方法がよくわからない！というあなたへdivの背景色を塗りつぶす方法を解説します。
この記事を読む
CSSで画像を上下(縦)中央,左右(横)中央寄せにする方法5選
2021年05月21日
CSSを使ってテキストや画像を中央寄せにしたい！という方のためにCSSで画像を上下や左右中央寄せにする方法を解説します。
この記事を読む
CSS display:flexで縦並びにする方法4選
2021年05月20日
「パスコン版で横並べにした要素をスマホ版で縦並びにしたい」「上下中央寄せのためにdisplay:flexを使ったが子要素を縦並びにしたい」というあなたへCSS display:flexで縦並びする方法を4種類解説します。
この記事を読む
display:flexでdivを2列の横並びにする方法
2021年05月20日
「display:flexを使えば2列の横並びができるらしいがよくわからない」 display:flexでdivを2列の横並びにする方法を解説します。
この記事を読む
【html/CSS】table,tr,tdにmarginが効かない原因と代替案
2021年05月17日
tableは表のタグです。エクセル的な表として使ったり、横並べのために使ったり、要素をそろえるために使ったりと便利なhtmlタグです。しかし「間隔を調整したいのにmarginが効かない!?」ということもあるでしょう。table,tr,tdにmarginが効かない原因と代替案について解説します。
この記事を読む
【html】tableで入力formのlabelとinputを横並びにする方法
2021年05月16日
formを作るときlabelで囲った項目名を左に、inputの入力項目を右に設置することが多いかと思います。また、そのlabelとinputを間隔や改行の調整もしたいですよね。今回はhtmlのformにてinputを横並びにし、改行や間隔を調整する方法を説明します。
この記事を読む
Edge"中国語のページを翻訳しますか"時のhtmlの直し方
2021年02月27日
Edgeを利用していると漢字があるページを中国サイトと捉え、日本語に自動翻訳することがあります。 「あれ!?文章がおかしくなってる!?」というときはだいたいこれです。 Edgeにてサイトが中国語として認識されている･変な変換がされているときの対処法を説明します。
この記事を読む
【CSS】tableなどのborderの重なりを消す(重ねる)方法
2021年01月29日
borderを指定してブロック要素やtableのtdが連続すると重なった部分だけ線が太くなる！borderの重なりを消す(重ねる)方法を紹介します。
この記事を読む
CSS borderで一部の線を消す方法
2021年01月27日
borderを指定すると上下左右すべてに線を引いてしまう。そのうち一部の線を消すにはどうしたらいいの!? そんな疑問にお答えすべく、CSS borderで一部を消す方法を解説します。
この記事を読む
【CSS】borderで上だけ、下だけ、上下だけに線を引く方法
2021年01月26日
borderを指定すると上下左右すべてに線を引いてしまう。上下だけに線を引くにはどうしたらいいの!? borderで上だけ、下だけ、上下だけに線を引く方法を解説します。
この記事を読む
inputのname属性をcssセレクタとして指定する方法
2021年01月25日
inputではname属性の指定がつきものです。そしてそのname属性は多くの場合個別の値が指定されます。ならわざわざclassをつけなくてもこのnameをセレクタとして指定できないだろうか。ということでinputのname属性をcssセレクタとして指定する方法を紹介します。
この記事を読む
Googleアドセンス振り込みの準備【PINコード・振込口座設定】
2021年01月25日
Googleアドセンスでの振り込みと審査に通ってから収益を得るまでに設定することについて解説します
この記事を読む
Googleアドセンス広告の貼り方
2021年01月25日
Googleアドセンスの審査を通過したらいよいよ広告を貼りましょう。 Googleアドセンス広告の貼り方を説明します。
この記事を読む
Googleアドセンスはいくら稼げるの？【当サイトのデータを公開】
2021年01月25日
「Googleアドセンスで収益化するとどのくらい稼げるもんなの？」 そんなあなたの疑問にお答えしたいと思います。 Googleアドセンスの収益化について、いろいろ実験的にやってみて見えてきたことなどを当サイトのデータを公開しつつ、ご紹介したいと思います。
この記事を読む
Googleアドセンスの始め方【審査突破のために】
2021年01月25日
ブログでお金を稼ぐと言えばまずは「Googleアドセンス」です。当ブログの収入源でもあります。そんなGoogleアドセンスの始め方と審査突破について解説します。
この記事を読む
ブログで稼ぐ方法【アドセンスとアフィリエイト】
2021年01月19日
「ブログで稼げるって聞いたけど何で稼ぐの？」 昨今、副業ブームであったり、コロナ禍で、ネットを通じて仕事にすることへ興味を持つ方も多いかと思います。 私が実践している、実践しようとしているものを含めて、ブログで稼ぐ方法を紹介します。
この記事を読む
CSS text-align:centerが効かない原因と対処法
2020年12月20日
text-alignは要素の位置を左寄せ・中央寄せ・右寄せにするCSSです。 しかし効かせるには条件があります。その条件を知らずに使うと「なんで中央寄せにならないの!?」となり、うまくいきません。 CSS text-align:centerが効かない原因と対処法について具体例を挙げながら解説します。
この記事を読む
CSS vertical-align:middleが効かない原因と代替案
2020年12月17日
「vertical-align:middleを指定したのに上下中央寄せにならない！」というときの原因と解決方法を説明します。 上下中央寄せする方法は複数あるので「vertical-align:middle」以外の上下中央寄せ方法についても解説します。
この記事を読む
aタグの中にdivやpタグ,aタグの中にaタグは可能か
2020年12月14日
「クリック範囲を大きくするためにaタグの中にdivを入れたいんだけどインライン要素であるaタグの中にブロック要素であるdivって入れちゃダメなんだっけ？」 aタグの中にdivやpタグ,divの中にdiv,aタグの中にaタグ,pタグの中にdiv,pタグの中にaタグ、は可能か解説します。
この記事を読む
CSSで0に関する省略【簡潔なコードに】
2020年12月08日
「CSSのコードを見るとたまに「0」が省略されてるんだけど、省略してもいいの？どうして省略できるの？」 CSSで0に関する省略について解説します。
この記事を読む
CSS input disabledの文字色や背景色を指定する方法
2020年11月29日
inputタグでdisabledを指定すると入力したりクリックしたり選択することができない状態にできます。しかし、「できない」状態であることが、文字色や背景色を変えて目視でわかるようにしたいですよね。input disabledの文字色やplaceholder、背景色（background-color）をCSSで指定する方法について解説します。
この記事を読む
html･CSSでinput(テキストボックス)のサイズ(幅)の変更方法
2020年11月29日
inputのtextつまりテキストボックスは主にフォームで使われる入力項目です。html･CSSでinput(テキストボックス)のサイズ(幅)を変更する方法を解説します。
この記事を読む
CSS display:blockが効かないとき確認すべき点
2020年11月23日
display:blockを利用するとaタグやspanタグimgタグなどのインライン要素をブロック要素にすることができます。 しかし、設定したはずのdisplay:blockが効かない!?なぜ!? そんなCSS display:blockが効かないとき確認すべき点を解説します。
この記事を読む
CSS display:blockなどdisplayを解除する方法
2020年11月23日
display:blockは要素をブロック要素に強制的に変更できるCSSです。 しかし、また元に戻したいときがあるかと思います。 displayを解除する方法を解説します。
この記事を読む
【CSS】divやdisplay:blockなどブロック要素を中央寄せする方法
2020年11月23日
中央寄せと言えばtext-align:centerなのにdisplay:blockを指定したら中央寄せにならないぞ？どうやるんだ？ divやdisplay:blockなどブロック要素の中央寄せについて解説します。
この記事を読む
CSS display:noneでアニメーションする方法
2020年11月23日
非表示から表示へ変わるとき、急にではなくアニメーションさせたい。 display:noneからdisplay:blockでアニメーションを設定したのに急に変わって、アニメーションしない!?なぜ!?どうすればいいの!? そんなCSS display:noneでアニメーションする方法を解説します。
この記事を読む
CSS border-radiusが効かない原因と対応方法
2020年11月20日
border-radiusは要素を角丸にするCSSプロパティです。しかしある条件によりborder-radiusが効かない、角丸にならない場合があります。そんなCSS border-radiusが効かない原因と対応方法について解説します。
この記事を読む
CSSのコメントアウトが効かないとき確認すること
2020年11月18日
CSSのメモ代わりに使ったり、一時的にCSSを効かなくさせたいときにコメントアウトをすることがあります。 しかし、コメントアウトのやり方を間違えるとコメントアウトが効かなくなります。 CSSのコメントアウトが効かないとき確認することを解説します。
この記事を読む
CSS opacityが効かない条件と回避方法
2020年11月18日
opacityは要素を透明、半透明にするCSSプロパティです。 しかし、ある条件によりopacityが効かなくなることがあります。 CSS opacityが効かない条件と回避方法を解説します。
この記事を読む
CSS background-color（背景色）が効かない原因と対応方法
2020年11月17日
background-colorは背景色を指定するCSSプロパティです。 background-colorで背景色を指定したのに色が変わらない!? そんなCSS background-colorが効かない・背景色が変わらない原因と対応方法を解説します。
この記事を読む
CSS display:noneが効かないとき確認すべき点
2020年11月17日
スマホ表示にしたとき、パソコン表示にしたときdisplay:noneで特定のhtml要素を消したいときよくありますよね。 しかし、設定したはずのdisplay:noneが効かない!?なぜ!? そんなCSS display:noneが効かないとき確認すべき点を解説します。
この記事を読む
【CSS】overflow:hiddenやscrollが効かない原因と対応方法
2020年11月14日
overflowを使うと要素を隠したりスクロールさせることができます。 しかし、ある条件によりoverflowが効かない、うまくいかないことがあります。 CSSのoverflow:hiddenやscrollが効かない原因と対応方法について解説します。
この記事を読む
環境によりCSSが効かないケースと対応方法
2020年11月14日
CSSがとある環境ではちゃんと効いているのに別の環境では効いていない。なぜ？ ホームページ制作をしているとお客さんから「ホームページが更新されていない」「表示がおかしい（CSSが効いていない）」と言われることがあります。 環境によりCSSが効かないケースと対処法について解説します。
この記事を読む
table,tr,spanなどCSSのpaddingが効かない原因と解決方法
2020年11月14日
paddingを指定したのに余白が思った通りにできていない！paddingはhtmlによって効かない原因が異なります。CSSのpaddingが効かない原因と解決方法をtable,tr,a,span,select,imgなどケース別に解説します。
この記事を読む
記事を書いた後の順位確認と改善方法【当サイトのデータ公開】
2020年11月10日
記事を書いた後ほったらかしでいいのだろうか？ちょくちょく記事の改善をしたほうがいいの？ そんな疑問にお答えすべく記事を書いた後の順位確認と改善方法について解説します。
この記事を読む
SEOを意識した記事のキーワード選定方法【1万のキーワードが見つかる】
2020年11月10日
テーマは決めたけどどんな記事を作ればいいんだろう？ キーワードはどうやって見つければいいの？ アクセスを増やせる記事を書きたい！ そんな疑問に答えるべく、SEOを意識した記事のキーワード選定方法を説明します。
この記事を読む
ブログテーマの決め方【結論：得意分野・好きな分野】
2020年11月10日
アフィリエイトブログに挑戦してみたいけど、そもそもどんなテーマのブログを作ればいいんだろう？ そんな疑問に答えるべく、ブログテーマの決め方を説明します。
この記事を読む
SEOの基礎【アクセスを増やすために】
2020年11月10日
アクセスを増やす方法を調べると必ずと言っていいほど「SEO」という言葉に出くわします。 このSEOについて、基礎的な知識と具体的な方法を解説します。
この記事を読む
ネットで売上を上げるための方程式
2020年11月10日
ネットで売上を上げるための方程式は次の通り。売上＝「商品の料金」×「集客数」×「コンバージョン率」。これらについて詳しく解説します。
この記事を読む
【html/CSS】divを横並びにする方法【手順を丁寧に解説】
2020年10月22日
「divが縦に並んじゃう！横に並べたいんだけど!?」 display:flexでdivを横並びにして、かつ崩さずピッタリにする方法を説明します。
この記事を読む
WordPress･htmlで画像を横並びにして下に文字を置く方法
2020年10月21日
ホームページに画像を載せるとき横に空白ができるのがもったいないから画像を横並べにしたいですよね。そのうえで画像の下に文字も書きたい。しかも中央寄せにしたい。 ということでWordPress･htmlで画像を横並びにして下に文字を置く方法を説明します。
この記事を読む
CSSを使わないでhtmlだけで横並びにする方法
2020年10月20日
「CSSなんか知らん！htmlだけでなんとかならんのか！こちとらWordPressだぞ！」そんなあなたのためにCSSを使わないでhtmlだけで横並びにする方法を説明します。
この記事を読む
td・tr・tbodyにclassを指定してもCSSが効かない原因
2020年10月19日
tableやtdをCSSセレクタで指定してるのにちゃんと効いていない？というときの注意点について解説します。
この記事を読む
CSS positionが効かない原因と解決方法
2020年10月19日
positionは自由に場所を指定でき、非常に便利なCSSです。しかし、ルールが多く思った通りになかなかいかないこともよくあります。CSS positionが効かない原因と解決方法を説明します。
この記事を読む
CSS position(absolute･relative･fixed)を解除する方法
2020年10月18日
CSSのposition:absoluteは便利なもので細かい位置移動や上から覆いかぶせたり、上部固定などができます。CSS position(absolute･relative･fixed)を解除する方法について説明します。
この記事を読む
CSS borderが効かない・表示されない原因と対応方法
2020年10月18日
あれ？borderを指定したのに線が何も表示されてないぞ？border効いてないのか？と思ってきた方へ、borderが効かない・表示されない原因と対応方法について説明します。
この記事を読む
CSSセレクタ、classにおける半角スペースの意味
2020年10月18日
CSSのセレクタにおいてスペースは重要な意味を持ちます。 CSSセレクタ、classにおける空白スペースの意味を解説します。
この記事を読む
CSSのセレクタでhrefのURLを指定する方法【前方一致・後方一致】
2020年10月18日
aタグにおいてhref属性にはURLを指定します。各aタグごとに違う情報が記述されているんだから、いちいちclassを指定しなくてもいいのでは？と思ったことかと思います。CSSのセレクタでhrefのURLを指定する方法を説明します。
この記事を読む
アフィリエイトって稼げるの？やり方は？
2020年10月17日
「ブログで稼げるらしいことを聞いたのだけど、具体的にはどうやるの？」「ASPとかアフィリエイトって何？」という疑問にお答えします。 アフィリエイトについて、稼げるのか、どうやるのかを解説していきます。
この記事を読む
月100円代のレンタルサーバーを徹底解説!!【このサイトで利用中】
2020年10月05日
当サイトにてひと月あたり167円で利用しているレンタルサーバーについて徹底解説します。前半ではサーバーの特徴を説明し、後半ではサーバーの具体的な立ち上げ方法を説明します。
この記事を読む
Googleサーチコンソールの使い方・見方
2020年09月22日
GoogleサーチコンソールはSEO・アクセス数を増やすために必須のツールです。 Googleサーチコンソールの使い方・見方を紹介します。
この記事を読む
Googleサーチコンソールのインデックス登録手順
2020年09月22日
インデックス登録とはGoogleにサイトや記事のURLを伝え、存在していることを知らせる行為です。 これをしないといつまで経ってもあなたのサイトはGoogle検索に表示されません。よってアクセスは0のままです。 Googleサーチコンソールのインデックス登録手順を説明します。
この記事を読む
Googleサーチコンソールの導入手順・設定方法
2020年09月21日
Googleサーチコンソールはアクセスされた検索キーワードを知ることができる唯一の手段です。アクセス数を増やすためには必須のツールです。 この記事ではGoogleサーチコンソールの導入手順・設定方法を解説します。
この記事を読む
Googleアナリティクスの使い方・見方
2020年09月21日
Googleアナリティクスは非常に便利で多機能です。一方で多機能すぎて何ができるのか一見わかりません。 Googleアナリティクスの機能のうちよく使うものを抜粋し、Googleアナリティクスの使い方・見方を紹介します。
この記事を読む
Googleアナリティクスの導入手順・設定方法
2020年09月20日
アクセス解析のためにGoogleアナリティクスを導入したいという方へGoogleアナリティクスの導入手順・設定方法を説明します。
この記事を読む
アクセス解析･Googleアナリティクスとは【アクセス数を増やすために】
2020年09月20日
アクセス解析とは、サイトにどのような人がいつどこにどうやって訪れたのか調査することです。 この記事ではアクセス解析の概要・目的、ツールの活用方法を解説します。
この記事を読む
WordPressテーマ自作方法
2020年08月30日
テーマとはWordPressにおけるサイトデザインテンプレートのことです。 サイトの目的によっては既存のテーマ・デザインではなくオリジナルのデザインを適用させたい場合があります。 オリジナルのテーマの自作方法を説明します。
この記事を読む
WordPressのプラグインとは
2020年08月30日
プラグインとはWordPressにおける「追加機能」のことです。 プラグインは非常に多くありますが、サイトによって要不要があるため必要なものだけ追加するという使い方になります。
この記事を読む
WordPress 記事作成方法
2020年08月29日
WordPressは記事をたくさん更新できる・更新しやすいことが特徴の一つです。基本的にはWordで文章が作るような感覚でカンタンに更新できます。とはいえ、機能が豊富です。すべてを覚える必要はありません。よく使う機能について説明します。
この記事を読む
WordPressの使い方【メニューの説明】
2020年08月29日
WordPressをインストールし、ログインできたものの何をどうすればいいのかわからない!? そんなかたのためにWordPressの使い方を説明します。主に各メニューの説明です。
この記事を読む
WordPressインストール手順【つまづきやすいポイントも解説】
2020年08月29日
WordPressを使うにはWordPressをサーバーにインストールしなくてはなりません。 WordPressのインストールの手順をつまづきやすいポイントとともに説明します。
この記事を読む
WordPress（ワードプレス）とは
2020年08月10日
WordPressとはインターネット環境とブラウザだけで簡単にホームページを更新できるシステムです。
この記事を読む
FFFTPでアップロードする手順
2020年07月26日
サーバーの用意ができたらファイルをアップロードできるようになります。公開時だけではなく、修正・更新のときにもアップロード・ダウンロードしますので手順をしっかり覚えていきましょう。
この記事を読む
ドメインとサーバーの紐付け手順
2020年07月26日
サーバーには「このドメイン使います」、ドメインには「このサーバーで使います」と知らせ、結び付ける必要があります。ここを超えるとドメインとサーバーが使え、サイトを公開できる状態になります。手順を丁寧に説明していきます。
この記事を読む
ドメインの自動更新設定方法
2020年07月26日
せっかく取得したドメインも1年後更新しないと使えなくなり、同時にサイトも見れなくなります。ドメインを自動更新されるようにして毎年滞りなく使えるようにしておきましょう。
この記事を読む
ドメインの具体的な取得方法【3ステップ】
2020年07月26日
ホームページを開設するにはドメインが必須です。ドメインの具体的な取得方法を3ステップで説明します。
この記事を読む
ドメインの決め方と料金【1円】
2020年07月25日
サイトを開設するにはサーバーの他にドメインが必要です。ドメインとは何か、ドメインの決め方・料金について説明します。
この記事を読む
激安レンタルサーバーの取得方法【167円/月】
2020年07月25日
1ヶ月あたり167円という激安料金で利用可能なレンタルサーバー「バリューサーバー」の取得方法を具体的に説明します。
この記事を読む
レンタルサーバーの料金と選び方
2020年07月24日
これからホームページやブログを始めようとしているあなた！レンタルサーバを料金や有名かどうかだけで選ぼうとしていませんか!?あなたに必要なスペックの中で最安値を狙うのが一番お得な方法です。あなたにピッタリのレンタルサーバの選び方を解説します。
この記事を読む
レンタルサーバーとは何か、なぜ必要か
2020年07月24日
ホームページ開設に必要なものの一つに「レンタルサーバー」があります。このレンタルサーバーとは何か、なぜ必要なのかを説明します。
この記事を読む
スマホ対応・レスポンシブデザインのコツ
2020年07月17日
「スマホ対応・レスポンシブデザインが必要なのわかったけど、実際問題具体的にどうやればいいの？」というあなたへ、スマホ対応・レスポンシブデザインサイトを作る具体的な方法とコツを説明します。
この記事を読む
メディアクエリの使い方/レスポンシブ･スマホ対応
2020年07月11日
今やスマホ対応があたり前、レスポンシブデザインがあたり前の時代です。でもどうやって対応させればいいのかわからない！そんなレスポンシブ・スマホ対応させる「メディアクエリ」の使い方について、基本的な書き方、ブレイクポイント、入れ子、印刷時対応、オススメの書き方を説明します。
この記事を読む
view portの書き方/レスポンシブ･スマホ対応【コピペでOK】
2020年07月11日
今どきレスポンシブ・スマホ対応が当たり前。しかしスマホ対応させるにも方法がわからない？レスポンシブ・スマホ対応view portの書き方について説明します。
この記事を読む
PCでスマホ表示に切り替える方法【Chromeを使おう】
2020年07月11日
スマホサイト開発や他社のスマホ対応動向確認のときPCで確認できれば楽です。PCのchromeでスマホ画面を表示する方法を紹介します。
この記事を読む
スマホ対応・レシポンシブデザインとは
2020年07月11日
スマホ対応とはスマホでも利用しやすいようにWebサイトを調整することです。
この記事を読む
htmlが崩れた原因特定方法【Markup Validation Serviceの使い方】
2020年07月11日
ホームページが崩れたけど原因がわからないと直しようがないですよね。まずは原因の切り分けと特定が重要です。ホームページが崩れたときはhtmlかCSSあるいはjavascriptなど原因が考えられます。全部一気に確認はできないのでまずここではhtmlに問題がないか確認・原因特定する方法を説明します。
この記事を読む
CSSが効かないときの原因特定方法【DevToolsの使い方】
2020年07月11日
CSSの一部が効かない！何が悪いのかわからない！という方へCSSが効かないの原因特定方法を説明します。
この記事を読む
CSSが効かない原因と回避方法【よくあるケアレスミス】
2020年07月04日
CSS効かない、htmlが崩れたときは以下に当てはまらないかチェックしてみてください。
この記事を読む
CSSの!importantの意味・使い方･注意点まで徹底解説!
2020年06月28日
CSSの!importantの意味・使い方・書き方・優先順位・重複したらどうなるのか、注意点・効かないときの確認方法などを徹底的に解説します。 マンガもあります。
この記事を読む
html内にCSS・styleを直書きする方法と使い分け
2020年06月28日
htmlタグの中にstyle属性を指定し、ダブルクォーテーションの中にCSSを直書きします。
この記事を読む
CSSセレクタの優先順位と点数計算
2020年06月27日
疑似クラス、属性セレクタなど含めたCSSセレクタの優先順位と点数計算方法を解説します。
この記事を読む
CSS positionの書き方【実装例・デモとあわせて紹介】
2020年06月25日
CSSのpositionの書き方をstatic,relative,absolute,fixed,stickyの使用例とともに説明します。
この記事を読む
CSS display:flexで解決できること9選!
2020年06月25日
display:flexは便利らしいがどんなときに使えるのか。 横並べを中心に、いろいろなことができるので覚えておきましょう。
この記事を読む
CSS displayの書き方・一覧【23種説明】
2020年06月25日
CSS displayの書き方を23種デモ付きで全部説明します！
この記事を読む
【CSS】marginとは？paddingとは？両者の違い・使い分けについて
2020年06月25日
marginとpaddingはボックスの余白を調整するCSSです。 marginとpaddingの使い方や違いについて説明します。
この記事を読む
CSS border(枠線)の使い方と種類一覧
2020年06月20日
CSS borderおよびborderに関連するCSSプロパティの種類一覧を実例とともに紹介します。
この記事を読む
CSS background【背景の指定方法】
2020年06月20日
CSSにおいて背景を指定するには「background」プロパティを使います。backgroundでは主に5つのプロパティがあり、それらを説明します。
この記事を読む
CSSでのカラーコード（色）の書き方
2020年06月19日
Webサイトでは背景色、線の色、文字の色など色（カラーコード）を指定する場面が多々あります。色（カラーコード）の書き方を3つ紹介します。
この記事を読む
CSSで使う長さの単位【px･em･%･vw･vh/calc】
2020年06月11日
CSSにはwidth等で大きさ・長さを指定するための単位が複数存在します。またそれらを計算できる仕組みがあります。これらをマスターしてイメージ通りのデザインを作成しましょう。
この記事を読む
CSS width height【要素の幅と高さを指定】
2020年06月11日
CSSのwidth（幅）とheight（高さ）の指定について説明します。あわせて注意点、min-width（最小幅）、max-width（最大幅）についても説明します。
この記事を読む
CSSセレクタとは【CSSを適用させる対象】
2020年06月11日
どのhtmlタグを対象とするのか指定するのがCSSセレクタです。classやid、そのほかよく使うセレクタを紹介します。
この記事を読む
CSSとは【CSSの書き方】
2020年06月11日
CSSはデザインをつかさどる言語です。 htmlが骨組みとなり、それに背景色や大きさ、配置といったデザインの指示を出すのがCSSです。 CSSはWebサイトを作るにあたり習得必須の言語です。
この記事を読む
htmlの相対パス・絶対パス【画像が表示されない・リンク切れのときに】
2020年06月04日
内部リンクなどファイルの場所を指定するとき、パスを指定することになります。パスを理解しないとリンク切れや画像が表示されないということになりかねません。そんな相対パスと絶対パスについて説明します。
この記事を読む
htmlでリンクの貼り方【aタグの使い方】
2020年06月04日
ホームページと言えばリンク、リンクのないホームページなどほぼありません。ホームページを作る以上必ず覚えなければならない「リンクの貼り方」です。htmlでリンクを貼るにはaタグを使います。
この記事を読む
【html】画像(img)の貼り付け方
2020年06月03日
画像を貼るにはimgタグを使います。htmlの画像の貼り付け方について、画像の準備の仕方も含めて解説します。
この記事を読む
html定型テンプレート【コピペでOK！】
2020年06月03日
htmlにおいて最初の型はほぼ一定です。コピペでさくっと作ってしまいましょう。
この記事を読む
htmlのブロック要素とインライン要素とは？
2020年06月03日
htmlタグは大きくブロック要素とインライン要素に分かれます。このブロック要素とインライン要素を理解していないとCSSで装飾するときにつまづきますし、html構築でも間違ってしまいます。
この記事を読む
htmlタグの親子要素･兄弟要素とは
2020年06月03日
htmlにおいて親子要素･兄弟要素というワードがでてきます。親子要素・兄弟要素について解説します。
この記事を読む
htmlタグの属性と値とは？【よく使う属性一覧】
2020年05月30日
htmlはタグを覚えただけでは使いこなせません。セットで使われる属性と値を覚えましょう。よく使う属性と値を紹介します。数はそれほど多くないので使いながら暗記しましょう。
この記事を読む
よく使うhtmlタグ一覧【12個に厳選!】
2020年05月30日
htmlタグはたくさんあります。その中でもよく使うhtmlタグを12個に厳選して紹介します。これを覚えれば最低限のホームページが作れます。
この記事を読む
html･CSS･javascript･PHPとは何か簡単にわかりやすく説明
2020年05月30日
htmlとそれに関連するCSS、javascript、phpとは何か簡単にわかりやすく説明します。この記事ではhtmlなどがどんなものなのかざっくりイメージをつかみ、概要がわかるように説明しています。
この記事を読む
Webサイト制作のおすすめ高機能無料エディタ【Brackets】
2020年05月30日
Web制作ができる最強の無料ソフトBracketsのメリット、Dreamweaverとの比較を紹介します。Dreamweaverの代わりになる無料エディタないかなぁという方にもおすすめしますし、ちょっとWeb制作始めてみたいという初心者の方にも超絶オススメです。
この記事を読む
ホームページ作成に最低限必要なもの
2020年05月24日
ホームページ作成に最低限必要なものにはパソコン・エディタ・インターネット環境・サーバー・ドメインが挙げられます。それぞれ説明します。
この記事を読む
Webサイト作成開始！
2020年05月24日
マンガでわかるホームページ作成は高校生の夢華がWebデザイナーであるお姉ちゃんにWebサイトの作り方を教えてもらうという話です。もちろん読者自身がWebサイトを作れるように説明してまいります。
この記事を読む
マンガでわかるホームページ作成について
2020年05月23日
「マンガでわかるホームページ作成」はいわゆるhtml入門であり、ホームページを作ったことがない方にもわかりやすいよう、その作り方をマンガで説明します。
この記事を読む
CSSで要素を追従させる「position:sticky」の使い方
2020年05月16日
position:stickyを使うと要素を追従させることができます。具体的に言うと指定した要素がスクロールされ、画面の一番上から画面外に行こうとしたときに画面一番上に固定されるイメージです。CSSで要素を追従させる「position:sticky」について説明します。
この記事を読む
CSSのソースを表示・確認する方法
2020年05月16日
「このサイトのCSSどうなってんだろ？」「自分とこのCSSどうなってたっけ？」と、CSSソースを確認したいときは多々あります。そんな時に使える「CSSのソースを表示・確認する方法」を説明します。
この記事を読む
【CSS】z-indexで重なり順を最前面にする方法
2020年05月15日
CSSのz-indexで重なり順を最前面にする方法を紹介します。
この記事を読む
CSSで最初の要素・最後の要素にだけ指定する方法
2020年05月15日
「CSSで最初の要素や最後の要素にだけ指定したい。でもいちいちclassを指定するのも面倒！」そんなときは以下に紹介する疑似クラスで解決できます。CSSで最初の要素・最後の要素にだけ指定する方法を説明します。
この記事を読む
CSSで文字を縁取りする方法【太い縁でもキレイに表示】
2020年05月15日
text-shadowなどで文字を縁取りする方法を紹介します。太い縁でもキレイに表示する方法も解説します。
この記事を読む
htmlやCSSで画像の横に文字を並べる方法６種【複数行OK】
2020年05月13日
htmlやCSSで画像と文字テキストを横並びにする方法を6つ紹介します。レスポンシブ対応できます。
この記事を読む
CSS !importantが効かないときの原因と解決方法7選
2020年05月11日
CSSの優先度を無視して最優先にする方法が「!important」を追加することです。しかし、「それでもCSSが効いていない!?」というときがあります。CSS !importantが効かないときの原因と解決方法を説明します。
この記事を読む
CSS display:flexの解除方法【カンタン!たった1行!】
2020年05月10日
レスポンシブ対応にも使える、display:flexを解除する方法を説明します。
この記事を読む
z-indexが効かない6つの原因と修正方法
2020年05月06日
position:absoluteと「z-index」を指定すると重なり順を変更することができます。「だというのに重なり順が変わらない!?z-indexが効いていない!?」というあなたのために「z-indexが効かない6つの原因と修正方法」を説明します。
この記事を読む
日本語フリーフォントをWebフォントとして使う方法【高速化もする】
2020年04月29日
WebフォントといえばGoogleフォントですが、フリーの日本語フォントはたくさんあります。そしてそれらはWebフォントとしても使うことができます。
この記事を読む
【CSS】日本語のWebフォント一覧 82選【無料】
2020年04月29日
無料で商用利用できる日本語フォントを比較しやすいように一覧化しました。漢字が使えるフォントに絞っています。
この記事を読む
【CSS】checkboxやラジオボタンのcheckedが効かない原因と修正方法
2020年04月29日
フォームを作るときlabelをクリックすることでinputタグが反応するようにすると利用しやすいですよね。しかしlabelのforが効いていないようでlabelをクリックしてもinputタグが反応しない？そんなときに見直す箇所をまとめました「CSS checkedやlabel forが効かない原因と修正方法」を説明します。
この記事を読む
Webフォント(Googleフォント)の使い方と高速化【容量2%に減】
2020年04月29日
Webフォントを使うときはフォントファイルの容量を軽くすることが重要になってきます。軽くする方法も含めて「Webフォントの使い方」をご説明します。
この記事を読む
CSS position: stickyが効かない原因(IEでも効かせる方法)
2020年04月05日
CSS position: stickyは指定した要素がスクロールしても画面上に追従するCSSです。しかし、特定の条件により効かないことがあります。CSS position: stickyが効かない原因と解決方法を説明します。
この記事を読む
CSSセレクタでor条件(AまたはB)and条件(AかつB)で複数指定する方法
2020年04月03日
or条件（AまたはB）はセレクタをカンマ区切り、and条件（AかつB）はセレクタを密接させます。 記事にて具体例と共に説明します。
この記事を読む
font-familyはメイリオがオススメな理由【よく使われる3つのフォントと比較】
2020年03月29日
CSSではfont-familyでフォントを指定できます。 でも、フォントってたくさんあって、ホームページやブログでは何を使うのが一番いいの!?font-familyはメイリオを指定することをオススメします。当サイトでもメイリオを使っています。font-familyはメイリオがオススメである理由を、Webサイトでよく使われる3つのフォントと比較しながら解説します。
この記事を読む
CSSだけで複数行3点リーダーを表示させる方法【IE対応】
2020年03月20日
3点リーダなんてCSSで簡単にできそうで意外と複雑です。CSSだけで一定行を超えたときに3点リーダを表示させる方法を解説します。IE対応です。
この記事を読む
CSS floatの使い方【floatは使わなくていい!!】
2020年03月19日
横並べといえばfloat。しかしfloatは初心者最大の難所といっていいでしょう。初心者から初級者になるための登竜門です！ぜひクリアして初級者の仲間入りしましょう！今回はCSS floatの使い方について説明します。
この記事を読む
【jQuery】クリックしたら特定の要素にclass付与する方法
2020年03月18日
こっちの要素をクリックしたときにあっちの要素を変化させたい！あっち要素にclassさえつけばCSSで調整できるのに！という要望を実現できます。クリックしたら特定の要素にclassをつける方法を紹介します。
この記事を読む
CSSセレクタで何番目以降･以前･偶数･奇数ごとに指定する方法
2020年03月09日
3番目以降あるいは3番目以前、偶数・奇数ごとに色を変えたい、デザインを変えたいってことありますよね？ そんなときに使える「CSSセレクタで何番目以降･以前･偶数･奇数ごとに指定する方法」を説明します。
この記事を読む
ホームページが更新されないときの対応方法10選
2020年03月08日
ホームページを更新した、あるいは業者に更新してもらったのにホームページが更新されていない!?あわてないでください。ホームページが更新されていないときの確認・確認事項として10個を挙げました。
この記事を読む
【CSS】borderをグラデーションにする方法
2020年03月08日
border（枠線）をグラデーションしてかっこよくしたい！ というかたへborderをグラデーションにする方法を説明します。
この記事を読む
CSSセレクタ一覧【擬似要素,擬似クラス,属性セレクタ】
2020年03月07日
主要ブラウザで使えるセレクタ等の一覧です。主要ブラウザで使えるセレクタ等の一覧です。CSSの記述例と実行例もあります。
この記事を読む
【CSS】deg角度確認一覧【transform:rotate】
2020年03月04日
CSSではtransform: rotateを使うことで回転させ、斜めを表現することができます。しかし45degと指定したらどうなるのか？一覧を作ったので参考にしてください。
この記事を読む
回転させるCSS transform:rotateの中心軸とその変更方法
2020年03月03日
CSSではtransform: rotateを使うことで回転させ、斜めを表現することができます。しかし、このtransform: rotateいったいどこが中心軸なのか？回転transform:rotateの中心軸とその変更方法について説明します。
この記事を読む
CSS opacityとtransitionでマウスオーバーしたとき透明に変化させる方法
2020年03月03日
opacityとtransitionでマウスオーバーしたとき透明に変化させる方法を説明します。よくある方法としてリンク画像にマウスを乗せたときに変化を加えるために透明にするということがあります。transitionを使うことで簡易なアニメーションを使うことができます。
この記事を読む
CSSで文字色を一部変える方法
2020年03月03日
文章を書いていて一部注目させたいワードを赤字にしたい！ってときありますよね。そんなときに使える「CSSで文字色を一部変える方法」を説明します。
この記事を読む
aタグ,span(インライン要素)やinline-blockを右寄せにする方法
2020年03月03日
aタグやspanなどのインライン要素やinline-blockを右寄せにする方法を説明します。
この記事を読む
margin:0 autoが効かない原因と修正方法・代替案
2020年03月02日
中央寄せするために「margin:auto」を指定したのに効かなくて中央寄せにならないことがあります。 そこでCSSのmargin:0 autoが効かない原因と修正方法・代替案を説明します。
この記事を読む
labelタグにCSSが効かない原因と修正方法
2020年03月01日
labelタグはinputタグとセットで使用し、inputのタイトルを示すものです。デザインとしてもinputのクリックできる範囲を大きくするために使うことがあります。しかし、labelタグにCSSが効かず思ったようにデザインできない!?そんな「labelタグにCSSが効かない原因と修正方法」を説明します。
この記事を読む
CSSのlinear-gradientで透過グラデーションを指定する方法
2020年03月01日
CSSではbackgroundとlinear-gradientを使うことでグラデーションを表現できます。しかし、透明色のグラデーションはできるのか？CSSのlinear-gradientで透過グラーデーションを指定する方法を説明します。
この記事を読む
html･CSSで改行させない方法７選【徹底解説】
2020年03月01日
htmlやCSSで文字やdivを改行させない、折り返しさせない方法を7パターン紹介します。div,span,table,tdなどにおいて使えます。white-space: nowrapなどのCSSを使います。
この記事を読む
CSSのfirst-childやlast-childが効かない原因と解決方法
2020年02月29日
子要素の最初と最後の要素に対する指定といえば疑似クラス:first-child :last-childです。しかしある条件により効かないことがあります。CSSのfirst-childやlast-childが効かない原因と解決方法を説明します。
この記事を読む
【CSS･html】idやclassの複数指定、同時指定方法
2020年02月29日
idやclassを複数指定できるのか!?CSS･htmlでidとclass同時指定、複数指定の注意点について説明します。
この記事を読む
CSS background-imageが表示されない9つの原因と修正方法
2020年02月29日
なぜかbackground-image（背景画像）が表示されない！そんなときのbackground-imageが表示されない原因と修正方法を9つ説明します。
この記事を読む
IEでは効かない！CSSでcalcを入れ子で使う方法と注意点
2020年02月28日
CSSではcalcという要素を使うことで違う単位のものを計算して出力できる非常に便利なものがあります。calcは入れ子で使うことができますが注意点もあります。
この記事を読む
CSSのborder-radiusで丸円・楕円を作る方法【枠線あり】
2020年02月27日
border-radiusは角を丸くするCSSです。 CSSのborder-radiusで丸円・楕円を作る方法を説明します。
この記事を読む
CSS box-shadowの影を下だけに出す方法4選
2020年02月27日
box-shadowを使うことでボックスに影をつけることができます。 しかし左右にも広がるため下にだけ影を出すにはひと工夫必要です。そこで、box-shadow 下だけに影を出す方法を4種類紹介します。
この記事を読む
CSS 沈むボタン,へこむボタンの作り方4種【コピペでOK】
2020年02月27日
ボタンにマウスを乗せたら沈むとボタンっぽいですよね。沈むボタンの作り方を4種説明します。
この記事を読む
CSSで最後の要素（last-child）へのafter指定方法
2020年02月27日
CSSにおいてちょっとした装飾をするときならbefore・afterを使うことでhtmlコードをシンプルにできます。さて、最後の要素（last-child）のafterを消したい、あるいは変更したい。 そんな最後の要素（last-child）へのafter指定方法を説明します。
この記事を読む
【CSS】疑似要素before・afterが効かない原因はcontentにあり！
2020年02月27日
CSSにおいてちょっとした装飾をするときbefore・afterを使うとhtmlコードをシンプルにできます。ただし、ちょっとしたことで効かなくなることがあります。CSSのbefore・afterが効かない原因を、失敗例を提示して説明します。
この記事を読む
【CSS】paddingやmarginの上下左右の順番を見て確認しよう
2020年02月26日
CSSで余白の調整の際に必ず使うpaddingやmarginは上下左右それぞれ指定できます。 その順番について説明します。
この記事を読む
CSS display:noneの解除方法
2020年02月25日
display:noneを指定すると要素を消すことができます。 display:noneを解除し、再度表示させたいことがあるかと思います。 CSS display:noneの逆、反対、つまり解除方法、表示方法について解説します。
この記事を読む
CSS classなどのセレクタの入れ子の書き方
2020年02月24日
classなど、CSSセレクタはたくさんありますが、中でもよく使うのが入れ子（子孫要素）へ指定するセレクタです。 これをしっかりマスターし、classだらけのhtmlから脱却しましょう。
この記事を読む
CSS animation opacity（透明）を使って明滅させる方法
2020年02月24日
CSS animation opacity（透明）を使って明滅させる方法を説明します。基本的なアニメーションの使い方がわかっていればカンタンです。
この記事を読む
CSS animationを止める方法【一時停止か終了時点で止める】
2020年02月24日
CSS animationを使ったものの、止め方がわからない。マウスを乗せたとき止めたい！最後の状態で止めたい！そんな「CSS animationを止める方法」を説明します。
この記事を読む
CSS animationで複数指定する方法
2020年02月24日
CSS3からanimationが使えるようになり、サイト上で複雑な動きをつけられるようになりました。 1つの要素に複数のanimationを指定することで複雑な動きをカンタンにつけることができます。そんな「CSS animationで複数指定する方法」を説明します。
この記事を読む
CSS animationの繰り返し方法
2020年02月24日
CSS3からanimationが使えるようになり、サイト上に複雑な動きをつけられるようになりました。 animationの良さの一つにアニメーションを繰り返せることがあります。そんなanimation 繰り返し方法を説明します。
この記事を読む
CSSのanimationのkeyframesの使い方【サンプルあり】
2020年02月24日
CSS3からanimationが使えるようになり、サイト上に複雑な動きをつけられるようになりました。使ってみたいけど、複雑でちょっと難しい!?そんなあなたのために、 animationの基本中の基本であるkeyframesについて説明します。
この記事を読む
CSSで外側にあるborderを内側に指定する方法
2020年02月24日
横並べにするためにwidthをぴったり指定したのにborderやpaddingをつけたら崩れた。 内側に指定して崩れないようにしたい。そんなときに使えるCSSで外側にあるborderを内側に指定する方法を説明します。
この記事を読む
CSSで下線(border-bottom･text-decoration:underline)の位置調整
2020年02月24日
CSSで下線（border-bottom・text-decoration:underline）の位置や太さを調整する方法を説明します。
この記事を読む
CSSでテキストを上下中央寄せにする方法
2020年02月24日
CSSでテキストを上下中央寄せにすること、よくありますよね。 でも意外とやり方がわからないものです。 そんな「テキストを上下中央寄せにする方法」を説明します。
この記事を読む
CSS flexで残りの幅を指定する方法【100% - ○px は可能!】
2020年02月24日
2列のボックスを作り、ある1方には幅を指定し、もう1方には残りの幅を指定したいときありますよね。そんな「CSS flexで残りの幅の指定の仕方」を説明します。
この記事を読む
CSSで矢印の角度を変える（90度以外にする）方法
2020年02月23日
CSSで矢印を作る方法は多く紹介されていますが、その矢印の角度は決まって90度です。しかし矢印は90度だけではありません。狭い角度や広い角度の矢印もあります。そんな角度を変えられる矢印の作り方を説明します。
この記事を読む
CSSで「×」バツ（閉じる）ボタンの作り方4種【コピペでOK】
2020年02月23日
CSSでバツボタンの作り方を説明します。 コピペでOKです。
この記事を読む
CSSでハートアイコンを作る方法【コピペでOK】
2020年02月23日
CSSでハートマークのアイコンを作る方法です。 コピペでOKです。
この記事を読む
CSSでinfoアイコンを作る方法【コピペでOK】
2020年02月23日
CSSで「i」マークのinfoアイコンを作る方法です。 コピペでOKです。
この記事を読む
CSSでヘルプアイコンを作る方法【コピペでOK】
2020年02月23日
CSSで以下のような「？」マークのヘルプアイコンを作る方法です。 コピペでOKです。
この記事を読む
【CSS】hover時に矢印がアニメーションで伸びる方法
2020年02月23日
ボタンの右に矢印があるデザインはよく見かけますね。 マウスを乗せたとき矢印が右に伸びるとクリックしたくなるものです。 ここではCSSでhover時に矢印が伸びる・動くアニメーションをするボタンの作り方を説明します。
この記事を読む
CSSだけで長い矢印アイコンの作り方【コピペでOK】
2020年02月23日
ネットで調べると三角だけの短い矢印アイコンの作り方は多数紹介されています。しかし長い矢印アイコンの作り方は意外と見つかりません。 ここでは長い矢印アイコンの作り方を説明します。 太長い矢印と細長い矢印を上下左右用意しました。 CSSをそのままコピペしてOKです。
この記事を読む
CSSでのcalcが効かない7つの原因と修正方法
2020年02月20日
cssで使うcalcが効かない原因と修正方法を7種お伝えします。先に言うとcalcは半角スペースのありなしがシビアです。
この記事を読む
CSSでaタグのhoverが効かない･文字色が変わらない原因と修正方法
2020年02月18日
hoverを使うとaタグの文字の色など変えることができます。しかしちょっとしたことでhoverがうまく効かないことがあります。 CSSでaタグのhoverが効かない･文字色が変わらない原因と修正方法を解説します。
この記事を読む
html･CSSでマウスオーバー時に色を変える方法
2020年02月18日
マウスオーバー時に要素を変化させるとクリックできることがわかったり、スペースの節約ができたりします。 html･CSSでマウスオーバー時に文字･ボタン･画像の色を変える方法を紹介します。
この記事を読む
CSSでborderを使わないで三角形を作る方法
2020年02月17日
この記事ではCSSでborderを使わないで三角形を作る方法をお伝えします。 backgroudを使います。
この記事を読む
CSSのみスライドショー【選択ボタン付き自動再生】
2020年02月17日
CSSのみのスライドショーです。自動再生する上に選択ボタンも付いています。htmlのラジオボタンとCSSを駆使して作成しました。
この記事を読む
CSSだけで選択ボタン付きスライドショー
2020年02月17日
javascriptを使わずCSSだけで選択ボタン付きスライドショーを作る方法です。
この記事を読む
CSSだけで自動再生スライドショー
2020年02月16日
javascriptを使わない、CSSだけの自動再生スライドショーの作り方です。
この記事を読む
CSSで片方だけ斜めにして台形にする方法
2020年02月14日
divなどの要素は長方形であり、1つの角が90度でない形にはできません。 しかし、見た目上の三角形と組み合わせることで見た目上の台形ができます。 ここではCSSだけで下だけ斜めの台形ができます。 レスポンシブ対応です。
この記事を読む
【html】画像を横並びにしたときずれる原因と修正方法
2020年02月13日
画像を横並びにしたとき画像の高さがあってなく、うまくそろってない、ずれていることがあります。 ここではその原因と修正方法についてご説明します。
この記事を読む
CSSでli(リスト)を均等幅や等間隔で横並びする方法
2020年02月13日
メインメニューなどはli（リスト）が均等に横並びしているものです。しかし、liの中のテキスト量はバラバラで、うまく横幅が均等にならないこともあるかと思います。 CSSでli（リスト）を均等･等間隔で横並びする方法を説明します。
この記事を読む
htmlやCSSでボタンを横並びにする方法(flexなど)
2020年02月13日
ボタンを横並びで2つ配置したいときがあります。 ボタンのサイズもそんなに大きくないからできればきれいに横並べしたい。 そんな「htmlやCSSでボタンを横並びにする方法」をご説明します。
この記事を読む
CSSでdivを横並びにしてレスポンシブ対応する方法
2020年02月13日
横並びにしたdivをレスポンシブ対応する方法を説明します。スマホ版で横並びにしたいときと、スマホ版では縦並びに切り替えたい時があると思いますのでそれぞれ説明します。
この記事を読む
【CSS】divをfloatなどで横に並べつつ中央寄せにする方法
2020年02月13日
1つのdivを中央寄せする方法は調べればいくらでも出てきますが、2つのdivを横にならべつつ、中央寄せする方法は意外とわからないものです。 divを横に並べつつ中央寄せにする方法を説明します。
この記事を読む
display:flexが効かない・横並びにならない原因と修正方法
2020年02月13日
display:flexは新しいCSSで、横並びにするときによく使う便利なCSSです。横並びと言えばfloatですがこれと同じように使うとCSSが効かず、うまく横並びにならないことがあります。 ここではdisplay:flexが効かない・横並びにならない原因と修正方法を説明します。
この記事を読む
CSSやhtmlで画像を横並びにする方法３選
2020年02月13日
CSSやhtmlで画像を横並び2列にする方法を3つ紹介します。レスポンシブ対応と中央寄せの方法も解説します。
この記事を読む
CSSやhtmlをマンガで学ぶ
