HTML+CSS Quick Start-Free online video tutorial-php.cn

Article Topic Learning Download Q&A Programming Dictionary Game Recent Updates

简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)

HTML+CSS Quick Start

This course starts from scratch, with actual cases to help you quickly master HTML+CSS and web page layout, declare your own style framework, enterprise-level development specifications, and achieve flexible use by developing a complete set of project templates!

Elementary

css

html

90316 person learning

95 class hour

12 hours 21 minutes 17 seconds Total course duration

2023-03-20update

PHP中文网

Gold lecturer

A total of 51 coursesStudent5294 Lecturer rating5.4

认证高级PHP讲师 More>>

Course Introduction Course Outline Data Download Other Courses

You will learn：

To be a good front-end, layout is the key! This course starts from 0, and practical cases will help you quickly master HTML+CSS and achieve flexible application. It is very suitable for students who need practical training!

HTML+CSS Quick Start

Chapter1 Understand the big front-end and prepare for learningtry and see
expand retract

Section1 vscode installation configuration-detailed explanation of commonly used plug-ins (subtitled version) try and see
duration： 41 minutes 01 seconds

Section2 If you want to do your job well, you must first sharpen your tools webStorm installation try and see
duration： 06 minutes 36 seconds

Section3 Program categories that front-end programmers can develop try and see
duration： 07 minutes 42 seconds

Section4 How to distinguish between H5, WEB front-end, big front-end, and WEB full stack? try and see
duration： 08 minutes 06 seconds
Chapter2 Commonly used tags and attributes in HTML
expand retract

Section1 HTML Hypertext Markup Language - Where is the hyper?
duration： 08 minutes 10 seconds

Section2 HTML main structure and related tags
duration： 05 minutes 55 seconds

Section3 HTML hexadecimal color values and comments
duration： 05 minutes 57 seconds

Section4 Use of HTML entity characters
duration： 04 minutes 51 seconds

Section5 Analysis of common tags in the head tag
duration： 11 minutes 09 seconds

Section6 Text and text format tags in body
duration： 08 minutes 39 seconds

Section7 H5 newly upgraded text format tags
duration： 09 minutes 24 seconds

Section8 Semantic tags and list layout tags
duration： 07 minutes 29 seconds

Section9 Path and jump issues that need to be paid attention to in a tags
duration： 06 minutes 19 seconds

Section10 Examples to explain multimedia tags
duration： 11 minutes 38 seconds

Section11 Memory skills for front-end massive tags
duration： 05 minutes 05 seconds

Section12 Complete explanation of markdown syntax
duration： 13 minutes 18 seconds

Section13 Elaborate on the table tag
duration： 10 minutes 12 seconds

Section14 Comprehensive analysis of elements related to form forms - Part 1
duration： 08 minutes 50 seconds

Section15 Comprehensive analysis of elements related to form forms-Part 2
duration： 09 minutes 08 seconds

Section16 Use of inline tag iframe
duration： 02 minutes 06 seconds
Chapter3 Stop streaking and enter the world of CSS
expand retract

Section1 Entering the world of css--several ways to reference css
duration： 08 minutes 42 seconds

Section2 css selector--basic selector analysis
duration： 05 minutes 32 seconds

Section3 css selector--hierarchical selector analysis
duration： 05 minutes 10 seconds

Section4 css selector--analysis of structural pseudo-class selector--Part 1
duration： 11 minutes 25 seconds

Section5 css selector--analysis of structural pseudo-class selector--Part 2
duration： 09 minutes 44 seconds

Section6 css status pseudo-class selector and selector priority
duration： 06 minutes 20 seconds

Section7 css-font font property
duration： 04 minutes 01 seconds

Section8 css-text text property
duration： 02 minutes 58 seconds

Section9 css--background background property
duration： 03 minutes 49 seconds

Section10 Class summary and chapter assignments
duration： 03 minutes 08 seconds
Chapter4 CSS style and layout control
expand retract

Section1 CSS width and height dimensions properties
duration： 09 minutes 22 seconds

Section2 CSS navigation list properties
duration： 05 minutes 50 seconds

Section3 CSS positioning property--fixed
duration： 06 minutes 01 seconds

Section4 CSS positioning property--relative positioning relative
duration： 03 minutes 17 seconds

Section5 The relationship between relative positioning and absolute positioning--Part 1
duration： 09 minutes 24 seconds

Section6 The relationship between relative positioning and absolute positioning--Part 2
duration： 09 minutes 05 seconds

Section7 CSS layout properties control the hiding and display of elements
duration： 10 minutes 57 seconds

Section8 CSS controls div to float left and right
duration： 10 minutes 34 seconds

Section9 Standard box model combined with floats
duration： 10 minutes 37 seconds

Section10 How to solve the problem of overlapping div margins
duration： 06 minutes 21 seconds

Section11 The relationship between box size and inner and outer margins and borders
duration： 05 minutes 12 seconds

Section12 The box-sizing attribute solves the problem of box wrapping
duration： 01 minutes 30 seconds

Section13 Flexible box model--flexible box layout
duration： 08 minutes 14 seconds

Section14 Telescopic box realizes multi-level navigation linkage
duration： 12 minutes 40 seconds
Chapter5 Practical definition of layout framework file
expand retract

Section1 In-depth analysis of flexible box model attribute settings-Part 1
duration： 11 minutes 19 seconds

Section2 In-depth analysis of flexible box model attribute settings-Part 2
duration： 06 minutes 21 seconds

Section3 Page layout analysis of corporate website
duration： 04 minutes 16 seconds

Section4 Define the underlying style file of the framework
duration： 11 minutes 35 seconds

Section5 Set the flexible layout public style of the frame
duration： 06 minutes 48 seconds

Section6 Set the frame's border public style
duration： 03 minutes 48 seconds

Section7 Set the margin public style of the frame
duration： 08 minutes 21 seconds

Section8 Set other public styles of the frame
duration： 03 minutes 50 seconds

Section9 Introducing public style rounded borders into the project
duration： 07 minutes 34 seconds

Section10 How to introduce iconfont font icon into the project
duration： 09 minutes 02 seconds

Section11 Practical combat--define the header public template file
duration： 05 minutes 24 seconds

Section12 Practical combat--define elegant search box style
duration： 06 minutes 17 seconds

Section13 Practical combat - setting the style, background and center alignment of font icons
duration： 05 minutes 31 seconds

Section14 Practical combat--Set the basic style of nav navigation bar
duration： 07 minutes 31 seconds
Chapter6 Actual animation and public headtry and see
expand retract

Section1 Text shadow and background color radial gradient try and see
duration： 04 minutes 55 seconds

Section2 CSS implements box conversion and transition effects try and see
duration： 08 minutes 22 seconds

Section3 Practical combat--css animation effects and animation carousel-Part 1 try and see
duration： 08 minutes 19 seconds

Section4 Practical combat--css animation effects and animation carousel-Part 2
duration： 07 minutes 09 seconds

Section5 Practical combat - css3 implements navigation underline animation effect using pseudo classes
duration： 04 minutes 48 seconds

Section6 Practical combat--implementing secondary menu styles and animation effects
duration： 10 minutes 06 seconds

Section7 Practical combat--implementing sidebar fixed effect-Part 1
duration： 08 minutes 14 seconds

Section8 Practical combat--implementing sidebar fixed effect-Part 2
duration： 03 minutes 31 seconds

Section9 Practical combat--implementing the style layout of the bottom footer
duration： 09 minutes 31 seconds

Section10 Practical combat--realizing the effect of product navigation on the home page
duration： 10 minutes 37 seconds

Section11 Practical combat - the header layout of the product display area
duration： 08 minutes 52 seconds

Section12 Practical combat--Style layout of product cards-Part 1
duration： 05 minutes 14 seconds

Section13 Practical combat--Complete the animation effect of product cards
duration： 06 minutes 42 seconds

Section14 Practical combat--Style layout of product cards-Part 2
duration： 04 minutes 49 seconds
Chapter7 List page and details page of actual combat
expand retract

Section1 Practical combat - Complete the style layout of breadcrumb navigation
duration： 05 minutes 35 seconds

Section2 Practical combat--complete the animation effect of product sorting-Part 1
duration： 14 minutes 22 seconds

Section3 Practical combat--Complete the animation effect of product sorting-Part 2
duration： 08 minutes 16 seconds

Section4 Practical combat--Complete the style layout of the product list page
duration： 06 minutes 12 seconds

Section5 Practical combat - Complete the style layout of the product basic information area
duration： 10 minutes 38 seconds

Section6 Practical combat - Complete the style layout of the product basic information area 02
duration： 08 minutes 03 seconds

Section7 Practical combat - Complete the style layout of the product basic information area 03
duration： 04 minutes 21 seconds

Section8 Practical combat - style layout of product details 01
duration： 08 minutes 26 seconds

Section9 Practical combat - style layout of product details 02
duration： 11 minutes 45 seconds

Section10 Practical combat-Guess you like the style layout of the area
duration： 11 minutes 16 seconds
Chapter8 Practical shopping cart and order page
expand retract

Section1 Mall shopping cart style layout 01
duration： 11 minutes 40 seconds

Section2 Mall shopping cart style layout 02
duration： 10 minutes 32 seconds

Section3 Mall shopping cart style layout 03
duration： 11 minutes 44 seconds

Section4 Order preview page--receipt information style layout
duration： 13 minutes 04 seconds

Section5 Order preview page--payment method style layout
duration： 06 minutes 11 seconds

Section6 Order preview page--Order content style layout 01
duration： 10 minutes 15 seconds

Section7 Order preview page--Order content style layout 02
duration： 06 minutes 00 seconds

Section8 Structural analysis of the mall personal center page
duration： 08 minutes 56 seconds

Section9 Order page and @media query-up
duration： 06 minutes 41 seconds

Section10 Order page and @media query - next
duration： 07 minutes 06 seconds

Data Nameoperate
[must see]HTML+CSS practical quick introductionExclusive for paid users

PHP中文网 Lecturer Other Courses

Elementary html5 Chinese manual

5511
Collection
Elementary CSS 2.0 Chinese Manual

6109
Collection
Elementary CSS 3.0 Reference Manual

3773
Collection
Advanced Play with CSS Flexbox layout

23764
Collection
Advanced Make layout as fast as 5G: CSS Grid grid layout

27258
Collection
Elementary The front-end course that understands you best: HTML5/CSS3/ES6/NPM/Vue/...[Original]

141452
Collection
Elementary Bootstrap3 reference manual

3335
Collection
Elementary Foundation5 Manual

902
Collection
Elementary JavaScript Reference Manual

9434
Collection
Elementary jQuery1.11 Reference Manual

9118
Collection
Elementary jQuery1.7 Chinese manual

5729
Collection
Elementary jQuery_API_1.4.4 Manual

4224
Collection

Delivery price：￥99

discount

VIP member exclusive VIP 60+ courses are free to watch

Coupon

Participate in the full reduction promotion The specific usage regulations are based on coupons

Buy Now

This course includes：

12 hours 21 minutes 17 seconds Watch videos anytime

1 Download Resources

Popular courses Latest courses

More>

About us Disclaimer Sitemap: php.cn：Public welfare online PHP training，Help PHP learners grow quickly！