2019年1月4日Web制作ツイートシェアはてブ送るPocketこんにちは、タカキです。HTML/CSSのコーディングをしてると、特に初心者のうちはうまくいかないことが多々あると思います。今回は、これらを解決するための手法を解説していきます。結論としては、「起きた出来事をそのまま検索する」です。記事の後半にありがちなトラブル・ミスもまとめたので是非ご覧ください。以下、詳細に入ります。まとめトラブルの内容を言語化して検索するまずは、トラブルの内容を言語化します。難しそうに聞こえますがやってみると結構簡単で、起きた出来事をそのまま文字に起こすだけです。例として、以下のHTML/CSSコードを見てみましょう。red;}このHTMLを開くと、以下のような結果になります。HTMLのpタグで囲まれたテストの文字色をCSSで赤色に変えようとしてますが、色が変わってくれません。変わらない」あたりでしょうか。これでもおそらく回答は出てくるのですが、より検索の精度を上げるために検証ツールで中身を確認してみましょう。検証ツールで見た結果が以下のようになりますpタグにCSSそのものが適用されていないことがわかります。効かない」あたりになりますね。あとはこれをそのままGoogleの検索欄に打ち込んであげればOKです。余白」等で検索するこのように、とりあえず起こった内容をそのまま検索してみましょう。Googleは検索が優秀なので、割と適当に検索しても案外答えを弾き出してくれます。HTML/CSSのコーディングはそこまで複雑なものでもないので、自分が抱えたトラブルはだいたい誰かしら経験していて、ネット上に発信してくれています。ググれば大抵のことは解決するので頑張って検索してみましょう!※おまけ:jsやjQueryが効かない場合jsやjQueryが効かない場合、コードミスによるエラーが発生している場合があります。その場合は検証ツールからエラーを開いて、エラー文をコピペしてそのまま検索すると答えが出てくることがあります。検索の仕方がどうしてもわからない、検索しても出てこない場合があります。この場合、HTMLの構造上の問題であることが多く、自分の理解度を大きく上回っているため一旦置いといて勉強し直すのをおすすめします。しても解決したい・・・となったなら、最後の手段として有識者に質問しましょう。プログラミング質問の専用サイト「teratail」というものがあります。https://teratail.com/エンジニア専用の質問サイトなので、yahoo!知恵袋のような総合的な質問サイトより質が高く適切な回答が望めます。質問にもテンプレートが用意されており、初心者の方にも使いやすくなっているためおすすめです。あるトラブルHTML/CSSのコーディングでありがちなトラブルをまとめました。コピペなり自分なりにまとめて、検索前にすぐ見れるようにしとくといいかもです。検証サービス」を使用する手がありますhttps://jigsaw.w3.org/css-validator/自分で見つけるのが難しかったらこちらを使ってもいいですね。閉じ括弧やスペルミスはテキストエディタによってはエラー表示を出してくれるので、エディタ側に頼るのもありです。(Brackets、VScodeあたりは初期状態からこの機能を搭載してます。・何が起こっているかを把握し、言語化する・トラブルやミスを経験し、自分の中でパターン化するこの2つを積み重ねていけば、仮に何か起こったとしてもすぐ解決できるようになります。コメントをキャンセルメールアドレスが公開されることはありません。東京都内でWebコーダーとして活動中。ブログではプログラミングやガジェット、お役立ちツールなんかを発信していくつもりです。Web制作のご依頼はお問い合わせから承っております。