پروژه
Website Personal Profile
این پروژه شامل ایجاد یک صفحه وب ساده برای پروفایل شخصی شماست. این پروژه به شما کمک می‌کند تا با مفاهیم پایه HTML آشنا شوید و یک صفحه شخصی برای خود ایجاد کنید که شامل اطلاعات مختصر در مورد شما، علایق و تجربیاتتان باشد.
1.
در این قدم، شما باید یک فایل HTML جدید ایجاد کنید. داخل این فایل یک ساختار پایه‌ی HTML شامل تگ‌های <!DOCTYPE html> و <html> را اضافه کنید. فراموش نکنید که تگ <head> و <body> را نیز اضافه کنید.
ایجاد ساختار پایه HTML به این صورت:
```html
<!DOCTYPE html>
<html>
<head>
<title>پروفایل شخصی</title>
</head>
<body>
</body>
</html>
```
2.
حالا وقت آن است که یک عنوان اصلی و یک زیرعنوان برای پروفایل خود اضافه کنید. از تگ‌های <h1> برای عنوان و <h2> برای زیرعنوان استفاده کنید. این متن‌ها می‌توانند نام شما و شغل یا حرفه‌تان باشند.
اضافه کردن عنوان و زیرعنوان به صورت زیر:
```html
<h1>نام شما</h1>
<h2>شغل یا حرفه شما</h2>
```
3.
در این مرحله باید یک بیوگرافی مختصر از خودتان بنویسید. از تگ <p> برای اضافه کردن متن بیوگرافی استفاده کنید. مطمئن شوید که اطلاعاتی شامل علایق و تجربیات شخصی را در این بخش وارد کنید.
اضافه کردن پاراگراف بیوگرافی:
```html
<p>اینجا بیوگرافی مختصر شما قرار می‌گیرد.</p>
```
4.
اکنون شما باید یک فهرست از علایق خود ایجاد کنید. از تگ <ul> (لیست نامرتب) و <li> (لیست موارد) استفاده کنید. این فهرست می‌تواند شامل فعالیت‌هایی باشد که شما به آن‌ها علاقه دارید.
ایجاد فهرست علایق:
```html
<ul>
<li>علاقه ۱</li>
<li>علاقه ۲</li>
<li>علاقه ۳</li>
</ul>
```
5.
در این مرحله شما باید لینک‌های اجتماعی خود را اضافه کنید. از تگ <a> برای ایجاد لینک‌ها استفاده کنید. این لینک‌ها می‌توانند به پروفایل‌های شما در شبکه‌های اجتماعی مختلف باشد.
ایجاد لینک‌های اجتماعی:
```html
<p>
<a href="https://www.linkedin.com/in/yourprofile">لینکدین</a> |
<a href="https://www.github.com/yourprofile">گیت‌هاب</a>
</p>
```
6.
در این مرحله، اگر بخواهید، می‌توانید استایل به صفحه خود اضافه کرده و جذاب‌ترش کنید. این کار از طریق استفاده از تگ <style> در بخش <head> انجام می‌شود. می‌توانید رنگ، اندازه و قلم متن‌ها را تغییر دهید.
اضافه کردن CSS:
```html
<style>
body {
font-family: Arial, sans-serif;
background-color: #f2f2f2;
color: #333;
}
</style>
```