سبد خرید (0)

آموزش W3.CSS

W3.CSS چیست؟

w3.CSS یکی از فریم ورک های CSS است و توسط W3schools پیاده سازی شده است. بعد از لینک کردن فایل W3.CSS به صفحات پروژه تان، می توانید از الگوهای بسیار جذاب آن برای ساخت سایت های واکنشگرا استفاده نمایید.

  • W3.CSS نسبت به دیگر فریم ورک ها مثل Bootstrap از حجم کمتری برخوردار است و در نتیجه سرعت لود صفحات افزایش پیدا خواهد کرد.
  • یادگیری و استفاده از آن نسبت به دیگر فریم ورک ها (Bootstrap) آسان تر است.
  • در پیاده سازی W3.CSS تنها از CSS استفاده شده است. (از JavaScript یا jQuery استفاده نشده)
  • با استفاده  از W3.CSS با سرعت و سادگی بیشتری می توانید طراحی کنید.
  • زمانی که آنرا به صفحه لینک می کنید، بصورت پیش فرض، حالت واکنشگرا را پشتیبانی می کند.
  • سایت تان در تمام مروگرهای اصلی مثل کروم, فایرفاکس, اینترنت اکسپلورر, سافاری و ... بدون مشکل کار خواهد کرد.
  • W3.CSS در تمام دستگاه ها، مثل  کامپیوتر, لپتاپ, تبلت و موبایل کار خواهد کرد.

W3.CSS Responsive


W3.CSS رایگان است.

W3.CSS برای یادگیری و استفاده رایگان است و نیازی به تهیه ی لایسنس نیست.


آسان برای یادگیری

"تا جایی که ممکن است ساده اش کن. ولی نه بیشتر"

آلبرت انیشتین

اولین مثال W3.CSS

<div class="w3-container w3-teal">  
<h1>My Header</h1>
</div>

<img src="/img_car.jpg" alt="Car">

<div class="w3-container">
  <p>A car is a wheeled, self-powered motor vehicle used for transportation.</p>
</div>

<div class="w3-container w3-teal">
  <p>My Footer</p>
</div>
خودتان امتحان کنيد »

لینک کردن W3.CSS به صفحات سایت

برای استفاده از W3.CSS در وب سایتتان, کافیست لینک W3.CSS را به صفحه ی وب سایتتان اضافه نمایید:

مثال

<!DOCTYPE html>
<html>
<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="stylesheet" href="http://www.beyamooz.com/lib/w3.css">
خودتان امتحان کنيد »

و یا میتوانید فایل w3.css را از خود سایت w3schools.com دانلود کرده و در پوشه ای در وبسایتتان قرار دهید.

مثال

<!DOCTYPE html>
<html>
<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="stylesheet" href="/lib/w3.css">
خودتان امتحان کنيد »

قالب های وب سایتی w3.css

در لینک زیر تعدادی قالب واکنشگرا با w3.css درست شده است و شما آزادید که این قالب هارا تغییر بدید, سیو کنید, به اشتراک بگذارید, استفاده کنید و یا هرکاری که میخواهید با آنها انجام دهید:

قالب آماده واکنشگرا