tgoop.com/Texpert_100/2108
Last Update:
✅ اینجا چند ترفند ساده ولی کاربردی برای HTML و CSS معرفی میکنم که میتونن برای طراحی حرفهایتر و بهینهتر به دردتون بخورن:
1️⃣ تصاویر پسزمینه رنگی با Gradient
میتونید با CSS گرادیانت بسازید و به عنوان پسزمینه استفاده کنید که نسبت به تصاویر سبکتره:
background: linear-gradient(135deg, #f06, #4a90e2);
2️⃣ ایجاد انیمیشن ساده با CSS
انیمیشنها میتونن به سایت جذابیت بیشتری بدن. برای مثال، متن یا دکمهای که تغییر رنگ میده:
button {
transition: background-color 0.3s;
}
button:hover {
background-color: #4a90e2;
}
3️⃣ سنتر کردن متن و المانها با Flexbox
برای قرار دادن المانها در وسط صفحه، میتونید از Flexbox استفاده کنید
.container {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
4️⃣ استفاده از Placeholder در فرمها با استایل سفارشی
با CSS میتونید استایل دلخواه برای متنهای placeholder فرمها تعریف کنید
input::placeholder {
color: #888;
font-style: italic;
}
6️⃣ ایجاد جداول ریسپانسیو با CSS
با استفاده از overflow
، جدولها رو در موبایل و دستگاههای کوچیک ریسپانسیو کنید:
table {
width: 100%;
overflow-x: auto;
display: block;
}
7️⃣ ساخت دکمه های گرد با HTML و CSS
برای دکمههایی با لبههای گرد
button {
border-radius: 50px;
padding: 10px 20px;
background-color: #4a90e2;
color: #fff;
}
🖥️ @Html_Css100
BY Texpert | تکسپرت
Share with your friend now:
tgoop.com/Texpert_100/2108