Your cart is empty.
Keep shopping
Teach on Udemy
Turn what you know into an opportunity and reach millions around the world.
Learn MoreHTML and CSS for complete Beginners
Rating: 4.3 out of 54.3(168 ratings)
3,514 students
HTML and CSS for complete Beginners
Learn HTML 5 and CSS3 from scratch and build interesting projects.easy step by step tutorials.
Created byNavjot Singh
Last updated 3/2018
English
English [Auto],
What you'll learn
- design a website
Explore related topics
Course content
2 sections • 43 lectures • 5h 27m total length
- overview0:59
- What is HTML ?1:56
Explore how hypertext markup language (HTML) uses opening and closing tags to format text, create bold content, images, and tables, and render results in a browser from a text editor.
- First webpage3:16
Begin by creating a project folder and a simple html file, edit it with any text editor, and view the result in your browser. Learn basic tags to format text.
- HTML Tags3:25
Discover how HTML tags act as core markup instructions, using opening and closing tags to wrap content, create bold or italic text, and assemble elements of a web page.
- HTML Basic Structure4:00
- HTML Headings2:15
Learn how HTML heading tags create titles and structure content, exploring the six heading levels from h1 to h6, their size relationships, and basic syntax.
- HTML paragraph4:22
Create your first paragraph using the p tag and write content inside. Use the br tag for line breaks, for spaces, and the pre tag to preserve exact whitespace.
- HTML Attributes4:46
Explore HTML attributes, learn how to add style, color, borders, and font sizes using the style attribute, and discover how title and other attributes enhance elements.
- HTML Comments3:01
Learn how HTML comments let you add personal notes inside your source code for memory aids and to request help from teachers or teammates, or temporarily disable code.
- HTML Anchor6:34
In this tutorial students will learn how to create hyperlinks in html
- HTML Image7:50
Learn to display images with the HTML img tag, using src and alt attributes, and resize with width and height while handling subfolders and external sources.
- HTML table13:27
Learn to build a basic html table using table, tr, td, and th, apply borders with css, set width to 50 percent, center text, and use colspan.
- HTML lists9:36
Learn to create and customize HTML lists, including ordered and unordered lists, with list-type and list-style-type for numbering and bullets. Explore nesting and markers such as circle, square, and disk.
- HTML Forms1:44
Explore how HTML forms collect user data with text fields including name, surname, password, and date of birth, using the form tag with method and action attributes to handle submission.
- Form Fields15:33
- Project: creating a registration form17:54
- HTML div5:07
Explore how the div acts as a container for a form, stretches to its size, adds a border, sets width, applies a sky blue background, and centers with CSS margins.
- HTML quiz
- About CSS5:05
Learn the basics of css by applying inline styles with the style attribute and using a style tag to style headings and paragraphs, including color and background color changes.
- Css identifiers6:20
Learn how to identify and style elements in CSS using IDs and classes, including selecting by tag name, proper comment syntax, and applying unique or shared styles.
- Css : Selecting child elements15:22
- Css Display3:13
Explore how the CSS display property shapes page layout by using inline, block, and none values, and see default display behavior for paragraphs and divs.
- Css more about display6:43
Explore the differences between block, inline, and inline-block display types in CSS, with practical examples using span, p, div, and other elements, and learn how height and width behave.
- Position: Relative6:21
Explore the CSS position property to move elements relative to their original position, using top and left offsets on a 400x400 green box with a 150x150 yellow inner box.
- Position: Absolute9:57
Learn how to use position absolute by marking a parent as relative and observing how the child moves relative to the nearest positioned ancestor or the document body.
- Position: Fixed6:03
Learn how position fixed keeps elements in place during scroll, contrasting with absolute and relative positioning, with practical examples like fixed navigation bars.
- Margin13:54
Explore how margins create space around elements and how padding separates content from borders. Master margin shorthand, per-side margins, inline-block centering, and text-align center on the parent for horizontal alignment.
- Padding7:37
Explore how padding defines the space between content and the element’s border, using a 400px square with 20px padding and top, right, bottom, left variations to adjust total size.
- Css quiz 1
- Overflow6:51
Learn how the overflow property manages content beyond a fixed height or width, with hidden, scroll, and auto options, plus the separate overflow-x and overflow-y controls.
- Border20:51
Master CSS borders by adjusting width, style, and color across elements, using shorthand and side borders for dotted, dashed, solid, double, groove, ridge, inset, outset, none, and hidden.
- Border Radius2:27
Learn how the border radius property creates rounded edges on a 200x200 red square, and how a radius of 100px makes a circle.
- Text-formatting21:26
Explore css text formatting: color, font-size units (px, percent, em), font-family, and font-weight, plus bold, underline, line-height, and centering text, including google fonts import.
- External Stylesheet6:19
Create an external stylesheet, link it in the head with rel=stylesheet and href, and edit in a code editor to leverage syntax highlighting and error checks.
- z-index6:18
Explore how the z-index property controls stacking order of absolutely positioned divs, using colors like green, yellow, and red to bring the top element to the front.
- Color codes1:59
Learn how to use color codes in CSS by using a color picker to choose light green, green, or gold and apply colors to backgrounds.
- Project 1: News Website design Part-114:37
Plan and build a cnn-like news site using html and css, featuring a black navigation bar with a logo and white text links, and a three-column content layout.
- project 1: website design part-28:51
Learn to structure a website header by building a navigation bar and a three-column container with left, middle, and right blocks, using percent widths, inline-block layout, and centered alignment.
- Project 1: website design part-311:55
- Project 1: website design part-414:32
Build a multi-section webpage by adding middle content with an image deck and title, and a right-side table with images and text; reuse classes and apply font and border styling.
- Project 1 website design part-5 Last8:01
- Hover Selector1:37
Explore the CSS :hover selector and see how hovering over elements like tables and table cells changes their background color to green, with practical on-screen examples.
- HTML Iframe2:49
Learn how to embed a web page inside another with the iframe element, using the src attribute and basic styling to adjust height, and note some sites block iframes.
- Box-sizing2:01
Discover how box-sizing in CSS includes padding and border in an element’s width and height, keeping a 200 px box with a 5 px border consistent.
- Project 2: create a virtual Mobile phone10:13
Create a virtual Samsung phone using HTML and CSS for complete beginners, featuring a mobile frame with rounded edges, a centered logo, and an embedded iframe with a gradient finish.
Requirements
- You should be able to use computer and browse internet.
Description
Easy HTML and CSS course is especially designed for beginners but anyone can give a try.Course starts with Introduction to HTML and HTML tags,attributes and Entities.then after finishing HTML section there will be an exercise in which students will make a registration form using html.
then students Learn Css from scratch and will be able to design a news website.
Who this course is for:
- Anyone Who wants to learn about web development