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 (almost 2 years 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