CSSクラス命名規則、FLOCSSとBEM。

A must-see for those struggling with CSS class names! Learn about class naming conventions 😆❕ 🎥 Video Structure 🎥 00:00 CSS Class Naming Conventions 00:24 What Makes a Good Class Name? 03:18 About FLOCSS 06:30 About BEM 08:32 Using FLOCSS and BEM Together ✅ Thank you for watching🙇‍♂️ If you enjoyed this video, please subscribe❗️ 👇Subscribe to "HIROCODE"👇 http://www.youtube.com/hirocode?sub_c... ◆ Twitter   / hirocodeweb   ◆ Instagram 👈 Recommended❗️   / hirocodeweb   🔋 Devices I Use and Recommended🔋 (Affiliate ads used!) 【Mouse】 ✅ Logitech Advanced Wireless Mouse MX Master 3 https://amzn.to/34Zn5LH " Improve your work efficiency with customizable buttons. Customizable for each application. " [Keyboard] ✅ Logitech Advanced Wireless Keyboard KX800 MX KEYS https://amzn.to/38S1B4i " Easy to type on, reduces fatigue, and is quiet. Recommended for those who code for long periods of time. " [Computer] ✅ Apple 16-inch Macbook Pro https://amzn.to/2WXKtEN " A larger screen size is convenient for getting work done more efficiently. I recommend investing in a good computer. " [Peripherals] ✅ Apple AirPods Pro https://amzn.to/3rAyU4u " The noise-canceling feature allows you to concentrate without being disturbed by surrounding noise, whether you're working in a cafe or on your commute. If you use other Apple devices, AirPods are recommended. ✅ Apple iPad Pro 11-inch https://amzn.to/3mZuvoo " With Sidecar, a feature built into Macs, you can use your iPad as a secondary display. " 📕 Recommended Books 📕 【Design Fundamentals】 ✅ Learn everything in one book: HTML & CSS and Web Design Introductory Course https://amzn.to/3o8vofO " Learn the basics of web design and coding (HTML/CSS). Recommended for beginners. " ✅ Understanding Design https://amzn.to/2X48Z77 " This book provides easy-to-understand, visual explanations of design in general. Recommended for anyone interested in design. " 【Design Thinking】 ✅ Who is Design for? https://amzn.to/3o4gzun " Understand the roles played in design. This book explains what you need to consider when designing. " ✅ Information Architecture Thinking: IA Thinking Techniques for Web Designers and Designers https://amzn.to/2KETvEn " A book to help you learn how to think about website design before you even begin designing. " [Book Device] ✅ Kindle Paperwhite https://amzn.to/3n2AwRh " I got rid of 200 business books and bought this. Some books aren't available digitally, but if you don't have a particular preference for paper books, I recommend reading e-books. 🎧 BGM 🎧 ---------------------------------------------------------- Music Title: Happy And Joyful Children Music Link:    • Happy Children Background Music / Joyful U...   ---------------------------------------------------------- #css #html #webdesigner

[New discovery!?] How to effectively specify pop-up elements in HTML!
▶︎

[New discovery!?] How to effectively specify pop-up elements in HTML!

【HTML CSS】グリッドレイアウトの使い方。Grid Layoutの基礎コーディング。
▶︎

【HTML CSS】グリッドレイアウトの使い方。Grid Layoutの基礎コーディング。

Two practical ways to use SVG in HTML CSS professionally
▶︎

Two practical ways to use SVG in HTML CSS professionally

【HTML入門】21個のタグを紹介!わかりやすくHTMLの基本を解説します〜初心者向け〜
▶︎

【HTML入門】21個のタグを紹介!わかりやすくHTMLの基本を解説します〜初心者向け〜

【Flexbox】HTML/CSS最強レイアウト!フレックスボックスの基礎講座。Flex入門コーディング
▶︎

【Flexbox】HTML/CSS最強レイアウト!フレックスボックスの基礎講座。Flex入門コーディング

Figma MCP × Claude Codeでデザインシステム準拠のUIを自動生成してみた
▶︎

Figma MCP × Claude Codeでデザインシステム準拠のUIを自動生成してみた

【web制作実務で必須!】HTMLのセクショニングコンテンツを理解しようwithCSS設計思想
▶︎

【web制作実務で必須!】HTMLのセクショニングコンテンツを理解しようwithCSS設計思想

HTMLサイトのWordPress化!WordPressの仕組みを理解しながら学ぼう!
▶︎

HTMLサイトのWordPress化!WordPressの仕組みを理解しながら学ぼう!

【前半】『CSS設計完全ガイド』の著者による「CSS設計のキホンと王道パターン」/半田 惇志(100/パンセ)
▶︎

【前半】『CSS設計完全ガイド』の著者による「CSS設計のキホンと王道パターン」/半田 惇志(100/パンセ)

#37 CSS Grid Tutorial [Complete Guide] - CSS Full Tutorial
▶︎

#37 CSS Grid Tutorial [Complete Guide] - CSS Full Tutorial

【実践】はじめてのレスポンシブコーディング!HTML CSS基礎講座。
▶︎

【実践】はじめてのレスポンシブコーディング!HTML CSS基礎講座。

Billionaire's WARNING: I'm SELLING. The Crash Is Already Here!
▶︎

Billionaire's WARNING: I'm SELLING. The Crash Is Already Here!

[For Web Design Beginners] How do you code from a design comp? A thorough explanation of the actu...
▶︎

[For Web Design Beginners] How do you code from a design comp? A thorough explanation of the actu...

EILMELDUNG: Sie haben mich ins Visier genommen
▶︎

EILMELDUNG: Sie haben mich ins Visier genommen

Austria Drama, Messi Scores Again | FIFA World Cup 2026 Highlights | Sportschau
▶︎

Austria Drama, Messi Scores Again | FIFA World Cup 2026 Highlights | Sportschau

【実践】ヘッダーの組み方 HTML/CSSコーディング part.1
▶︎

【実践】ヘッダーの組み方 HTML/CSSコーディング part.1

【超入門】Flexboxを30分で完全習得!初心者向け【HTML・CSS コーディング】
▶︎

【超入門】Flexboxを30分で完全習得!初心者向け【HTML・CSS コーディング】

[Overseas Reactions] The world praises Masako's upper-class language skills, which astonished the...
▶︎

[Overseas Reactions] The world praises Masako's upper-class language skills, which astonished the...

【ネイティブ感覚】前置詞はどういう感覚でネイティブは使ってるの?
▶︎

【ネイティブ感覚】前置詞はどういう感覚でネイティブは使ってるの?

Panama – England Highlights | Gruppe L, FIFA WM 2026 | sportstudio
▶︎

Panama – England Highlights | Gruppe L, FIFA WM 2026 | sportstudio