https://github.com/afa-farkhod/portfolio-html-css
Portfolio using HTML and CSS
https://github.com/afa-farkhod/portfolio-html-css
css html
Last synced: 3 months ago
JSON representation
Portfolio using HTML and CSS
- Host: GitHub
- URL: https://github.com/afa-farkhod/portfolio-html-css
- Owner: afa-farkhod
- License: apache-2.0
- Created: 2023-09-13T11:42:48.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-03-02T10:58:45.000Z (over 1 year ago)
- Last Synced: 2025-02-02T01:13:31.886Z (4 months ago)
- Topics: css, html
- Language: CSS
- Homepage: https://afa-farkhod.github.io/cv
- Size: 281 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Portfolio-HTML-CSS
Portfolio using HTML and CSS- The `HTML` file provides the structure and content of the webpage, while the `CSS` file (style.css) provides the visual styles and layout for the elements. The webpage includes a header with navigation links and a prominent home section introducing the page owner with an image, heading, subheading and social media links.
- `index.html` HTML Structure:
- DOCTYPE html ~ declares the HTML version.
- html lang = en ~ the root HTML element with the language set to English.
- head ~ contains meta information and links to external resources.
- meta tags for character set, compatibility, and viewport settings.
- title links to an external CSS file (style.css) and a font stylesheet.
- body ~ contains the content of the webpage.
- header Section contains a logo and a navigation bar with links.
- home Section contains two main elements: an image and content.
- Image (img) and content (heading, subheading, and paragraph) for a personal introduction.
- Social media icons and a "Download CV" button.- `style.css` CSS Resets and Global Styles:
- Resets default margins, padding, and box-sizing for all elements.
- Sets the font family to 'Poppins' for the entire document.
- Header Styles ~ styles for the header section, including positioning, background, and styling of the logo and navigation links.
- Home Section Styles ~ styling for the home section, including background gradient, layout, and alignment of the image and content.
- Home Image Styles ~ styling for the circular image.
- Home Content Styles ~ styling for the content within the home section, including typography and layout.
- Animation Styles ~ an animation (animateText) for a text background gradient effect.
- Social Icons Styles ~ styles for the social media icons.
- Button Styles ~ styles for the "Download CV" button.
![]()
## [Reference]()
- [boxicons](https://boxicons.com/) - Simple Open Source icons carefully crafted for designers & developers
- [w3schools](https://www.w3schools.com/html/default.asp) - HTML is the standard markup language for Web pages.
- [javatpoint](https://www.javatpoint.com/html-tutorial) - another HTML & CSS related course materials