این دفعه بهترین کارهایی که می‌توانید با CSS انجام دهید را تنها در چند خط کد جمع‌آوری کرده‌ام. پس بیایید شروع کنیم!
1. پیمایش روان
وقتی دکمه‌ای دارید که قسمتی متفاوت از صفحه وب را نشان می‌دهد، این تکنیک می‌تواند بسیار مهم باشد. می‌توانید به سادگی این کار را با «href=”#goToContact» انجام دهید اما جذاب نخواهد بود. داشتن یک پیمایش روان بسیار جذاب و حرفه‌ای است. بازدیدکنندگان وبسایت شما لایق بهترین تجربه کاربری هستند.
html {
scroll-behavior: smooth;
}
2. اندازه تصاویر را متناسب کنید
آیا برای قرار دادن درست تصاویر در صفحه‌ی وب خود مشکل دارید؟ من برای این کار راهکاری ساده سراغ دارم که می‌توانید مثل یک حرفه‌ای آن را انجام دهید. به عنوان مثال:
img {
max-width:100%;
height:auto;
}
3. تنظیم یک عکس به عنوان نشانگر
آیا می‌خواهید نشانگر خود را نیز مثل برنامه وب یا وبسایت خود منحصر به فرد کنید؟ خب این کار می‌تواند یک هدیه‌ی بی نظیر به بازدیدکنندگان شما بدهد:
body {
cursor: url("images/cursor.png"), auto;
4. هر چیزی را در 3 خط کد سنتر کنید
می‌رسیم به سنترینگ در CSS، چه کسانی نگران آن بودند؟ در اینجا 3 خط CSS جادویی برای سنتر کردن هر چیزی آورده شده است:
.center {
width: 300px;
height: 300px;
display: flex;
justify-content: center;
align-items: center;
}
5. محتوای محدودی را در یک پاراگراف قرار دهید
آیا باید تنها چند عبارت را در پاراگراف خود نمایش دهید؟ دوباره می‌گویم که CSS می‌تواند این کار را در یک خط انجام دهد. ویژگی «webkit-line-clamp» در CSS اجازه می‌دهد تا محتوای یک بخش کانتینر به تعداد مشخصی از خطوط محدود شود.
p {
-webkit-line-clamp: 5;
}
دیدگاه و پرسش
در حال دریافت نظرات از سرور، لطفا منتظر بمانید
در حال دریافت نظرات از سرور، لطفا منتظر بمانید