FullStack Path

Posts

Showing posts with the label css

Create your first website with Home, Contact us, Register, Login Pages

September 30, 2024

Create a Folder Structure for Your Website 1. Create a folder named MyFirstWebsite . 2. Inside the MyFirstWebsite folder, create the following HTML files: index.html (Home page) contact.html (Contact Us page) register.html (Registration page) login.html (Login page) MyFirstWebsite/ │ ├── index.html ├── contact.html ├── register.html ├── login.html └── main.css Note: why the main HTML file is named index.html 1. Default Behavior: Most web servers automatically serve index.html when a directory is accessed (e.g., http://example.com/). 2. Organizational Convention: It clearly indicates the starting point of a website, making projects easier to navigate. 3. SEO and Usability: Enhances usability for users and search engines by providing a clear homepage. 4. Historical Context: This naming convention has been widely accepted since the early days of the web. Using index.html ensures compatibility with hosting services and improves site navigation. File Content index.html <!DOCTYPE html>

CSS: Types of Selectors

February 21, 2024

what is selectors? CSS selectors allow you to target specific HTML elements. You can select elements by tag name (e.g., h1, p), class (e.g., .container, .button), ID (e.g., #header, #footer), or other attributes. There are several important types of selectors in CSS: 1. Element Selector 2. ID Selector 3. Class Selector 4. Pseudo-Class Selector 5. Pseudo-Elements Selector 6. Descendant Selector 7. Child Selector 8. Adjacent Selector 9. General Sibling Selector 10. Attribute Selector 1. Element Selector The simplest kind of selection targets HTML components based on their tag name. EX. index.html <!DOCTYPE html> <html lang="en"> <head> <title>My First WebPage</title> <link href="./main.css" rel="stylesheet"></link> </head> <body> PARA 1 SPAN PARA 2 </body> </html> main.css p { color: red } Output: Oh no! Fan