やあ ？、

私は 3 年の経験を持つフロントエンド開発者です。私は常に自分の知識のギャップを埋めて、フルスタックの開発者になりたいと考えていました。オーディン プロジェクトを開始しようと何度か試みましたが、一貫して実行することができませんでした。今度はこれを継続してスキルを向上させることにしました。

私の進捗状況を追跡するために、Odin プロジェクトの各章から学んだことを詳しく説明する一連のブログ投稿を公開する予定です。これらは私の開発日記として考えてください。

私が学んだトピックを追加し、これまで知らなかったことを共有します。

HTML としての CSS と、これまでに経験した、または少なくとも私が知っているすべての入門的な内容から始めます。

学んだトピック

• セレクター

1. ユニバーサルセレクター
2. タイプセレクター
3. クラスセレクター
4. IDセレクター
5. グループ化セレクター
6. チェインセレクター

• コンビネータ コンビネーターの使い方については知っていましたが、その具体的な用語については知りませんでした。また、セレクターのグループ化やチェーン化以外のセレクター間の関係に関する定義も含まれます。
• 子孫コンビネータ

基本的な CSS プロパティ

• 色、背景色
• タイポグラフィ

1. フォント ファミリーと汎用フォント ファミリー

• 画像の高さと幅
  ここで私が学んだもう 1 つのことは、HTML 内の画像には常に幅と高さの両方の属性を指定することをお勧めするということです。これにより、ブラウザーはページのレンダリング中に画像用に適切なスペースを確保し、画像の読み込み時にコンテンツ レイアウトが予期せず変更されるのを防ぎます。画像の元の縦横比を維持するには、幅属性のみを変更し、高さを「自動」に設定します。これにより、画像の比率に基づいて高さが自動的に調整されます。

• 外部 CSS

• 内部およびインライン CSS

私の技術責任者が HTML にインライン CSS を追加したときのことを思い出します。彼は経験豊富なプロであり、私はまだこの分野では比較的初心者だったので、私は彼の決定に疑問を抱くことを躊躇しました。

しかし、今では、より効果的なアプローチは、インライン CSS の使用を最小限に抑えることを提案することであったと理解しています。インライン スタイルを、ルールが機能するために絶対に必要なスタイルのみに制限することで、過度の具体性の適用を回避し、よりクリーンで保守しやすいコードベースを維持できます。

学んだことを要約した毎週のポッドキャストも公開する予定です。