This course gives you the practical skills to build and style professional websites with CSS. Starting with the fundamentals, you’ll practice hands-on challenges that cover layout, typography, colors, and buttons before moving into more advanced concepts including positioning, z-index, and CSS specificity.
Throughout the course, you’ll build a coworking space site and an NFT site, applying new techniques in real-world scenarios. You’ll explore how margins, flexbox, and selectors work, while learning to debug and refactor your code for clean, maintainable results. Each lesson introduces you to concepts step by step, ensuring you can both understand and apply CSS confidently.
By the end, you’ll not only know how to create stylish, responsive page layouts but also how to organize CSS efficiently, handle tricky issues such as vertical alignment, and design with consistency across sections and elements. With challenges, guided projects, and applied examples, this course prepares you to bring your creative designs to life with CSS.
Learn how to build a structured, well-styled website from scratch using semantic HTML and practical CSS techniques, while tackling common layout challenges and enhancing interactivity.
涵盖的内容
1个作业33个插件
显示有关单元内容的信息
1个作业•总计30分钟
Build an NFT Site Graded Assignment•30分钟
33个插件•总计130分钟
Welcome to interactive lessons!•1分钟
Essential CSS Concepts Intro•1分钟
Build an NFT Site Intro•1分钟
Semantic HTML - Header, Main, Section, Footer•6分钟
Set up the CSS basics•4分钟
Aside: Margins - strange behaviour•6分钟
Header•4分钟
The first section - image•3分钟
The first section - text•6分钟
Aside: Hover and active states•10分钟
The first section - links•3分钟
Aside: background full width•6分钟
Content Container•4分钟
CSS organisation•3分钟
The second section colors•3分钟
The second section imgs•4分钟
Style the Footer•2分钟
Grouping Selectors•4分钟
Warning: Viewing Problems•1分钟
Aside: Specificity•6分钟
Aside: Compound selectors•6分钟
Aside: Compound selectors and specificity•5分钟
Line-height debug•3分钟
CSS specificity and !important keyword•3分钟
Aside: Buttons/Links•3分钟
Style the buttons individually•6分钟
Aside: Inline-block•4分钟
Space out the buttons•3分钟
Aside: A main class and a modifier class•4分钟
Refactor the buttons•3分钟
Aside: Flexbox flex-wrap•1分钟
Aside: Overflow•6分钟
Aside: CSS float•5分钟
CSS Fundamentals: Challenges
第 2 单元•小时 后完成
单元详情
This course challenges you to apply core CSS skills through practical exercises, helping you refine layouts, typography, colors, and interactive elements to create polished, adaptable designs.
CSS Fundamentals: Challenge #10 - Working with what you have•2分钟
CSS Fundamentals: Solution #10 - Working with what you have•5分钟
Build a Coworking Space Site
第 3 单元•小时 后完成
单元详情
This course guides you through building a coworking space website while mastering CSS positioning, alignment, and layering techniques to create a functional and visually appealing layout.
涵盖的内容
1个作业13个插件
显示有关单元内容的信息
1个作业•总计30分钟
Build a Coworking Space Site Graded Assignment•30分钟
Scrimba is an interactive code-learning platform with over a million users from all over the world. They feature highly interactive and engaging courses about programming and web development.
When will I have access to the lectures and assignments?
To access the course materials, assignments and to earn a Certificate, you will need to purchase the Certificate experience when you enroll in a course. You can try a Free Trial instead, or apply for Financial Aid. The course may offer 'Full Course, No Certificate' instead. This option lets you see all course materials, submit required assessments, and get a final grade. This also means that you will not be able to purchase a Certificate experience.
What will I get if I subscribe to this Specialization?
When you enroll in the course, you get access to all of the courses in the Specialization, and you earn a certificate when you complete the work. Your electronic Certificate will be added to your Accomplishments page - from there, you can print your Certificate or add it to your LinkedIn profile.
Is financial aid available?
Yes. In select learning programs, you can apply for financial aid or a scholarship if you can’t afford the enrollment fee. If fin aid or scholarship is available for your learning program selection, you’ll find a link to apply on the description page.