X
تبلیغات
امپراطوران آنلاین
دسته‌بندی کد Css - کدهای حرفه ای وبلاگ و سایت
CSS

CSS چیست

 سی‌اس‌اس روشی ساده برای نمایش چیدمان و جلوه‌های تصویری (مانند نوع قلم، رنگ و اندازه‌ها) بر صفحه‌های وب است. الگوهای آبشاری از جنس زبان‌های نشانه‌گذاری، با ساختار متن سادهٔ رایانه هستند و درون هرکدام، دستورهایی آبشار مانند و پی‌درپی، برای چگونگی نمایش هر صفحه وب افزوده می‌شود.

منبع دانشنامه ویکی پدیای فارسی

CSS3

Css3 در واقع سومین نسخه از سری دستورات الگوهای آبشاریست که همزمان با html5 و عرضه ی کتابخانه Jquery موجب تحولی عظیم در صنعت طراحی وب شدند طراحی های پیچیده ای مانند گردبر نمودن گوشه ها یا سایه دار نمودن جعبه ها که می بایست در فتوشاپ تنظیم می شد و بعد از کسر حجم با گرافیکی معمولا غیر قابل قبول در فضایی آپلود می شد با دستورات css اجرا گردیدند به عنوان مثال به حروف css3 نوشته شده در زیر این متن نگاه کنید و با تاشاره گر موس به روی آن بروید تا تغییرات را محسوس تر ببینید همچنین بر روی آن کلیک کنید و موس را نگه دارید تمام آنچه که می بینید یک فونت ساده و دستورات CSS3 می باشند

C  SS3
WP-Parsi

انجمن پشتیبانی وردپرس پارسی فعال شد

انجمن پشتیبانی وردپرس پارسی به همت تعدادی از برجسته ترین وردپرس کاران و برنامه نویسان ایرانی راه اندازی گردیده که می تواند پاسخگوی بسیاری از سئوالات شما باشد حتی اگر با وردپرس کار نکرده اید و نمی کنید سر زدن به این انجمن را به شما توصیه می کنم

انجمن پشتیبانی وردپرس پارسی

NextPrev
CSSCSS3WP-Parsi

رسم جدول بخش یک

جمعه 9 فروردین 1392 ساعت 18:09

سلام 

سال نو مبارک 

قصد دارم در طی دو یا سه پست تمام مراحل رسم یک جدول حرفه ای را با استفاده از کدهای html  و دادن یک استایل حرفه ای به جداول توسط css3  و JQuery  را دذر وبلاگ css3 قرار بدم برای شروع و آشنایی با مقدمات و طراحی ساده یک جدول به ادامه مطلب مراجعه فرمایید 

ادامه مطلب ...
del.icio.us  digg  newsvine  furl  Y!  smarking  segnalo

آموزش کشیدن نمودار با css

یکشنبه 12 شهریور 1391 ساعت 21:56

فرض می کنیم که می خواهیم از کارکرد 5 ماه یک پیمانکار نموداری ترسیم کنیم و مراحل اولیه برای محاسبه ی کارکرد ریالی را انجام داده ایم و در حال حاضر نتیجه ای به شرح زیر داریم

  1. کارکرد ماه اول : دو میلیون و پانصد هزار ریال

  2. کارکرد ماه دوم : دویست هزار ریال

  3. کارکرد ماه سوم چهار میلیون ریال

  4. کارکرد ماه چهارم : سه میلیون و هفتصد و بیست و سه هزار ریال

  5. کارکرد ماه پنجم: دو میلیون و هشتصد هزار ریال

ادامه مطلب ...
del.icio.us  digg  newsvine  furl  Y!  smarking  segnalo

رونمایی از یک قالب جدید

چهارشنبه 8 تیر 1390 ساعت 18:12

قالبی که در تصویر مشاهده می کنید یک قالب استثنایی است که توسط این وبلاگ برای استفاده در سرویس بلگ اسکای طراحی 

یکی از امتیازات این قالب طراحی با کدهای CSS  و کمترین استفاده از JAVASCRIPT در نتیجه وزن سبک و بازدهی مناسبه و امتیاز دیگه اش هم اینکه ایده و اجرا کپی برداری از نمونه های خارجی و داخلی مشابه نیست و برای اولین بار از طریق این وبلاگ عرضه شده و به این لحاظ بسیار منحصر به فرده 

برای مشاهده تصویر در سایز بزرگتر روی آن کلیک کنید 

نمونه را وبلاگ را با این قالب در وبلاگ جناب بوم نقاشی ببینید 

کد را از ادامه مطلب بردارید و در بخش ویرایش قالب ها بجای کل کدهای موجود قرار دهید

ادامه مطلب ...
del.icio.us  digg  newsvine  furl  Y!  smarking  segnalo

آلبوم عکس

چهارشنبه 25 خرداد 1390 ساعت 00:34

امروز با استفاده از یکی از قابلیتهای منحصر به فرد css3 آلبوم عکسی دیدنی رو فراهم کردم 

این آلبوم با استفاده از تعریف target در استایل بندی تهیه شده از لحاظ قالب بندی آلبوم بسیار سبک و روان است 

del.icio.us  digg  newsvine  furl  Y!  smarking  segnalo

کد و نام رنگ ها

یکشنبه 15 خرداد 1390 ساعت 08:12

ما در CSS سه حالت برای درج رنگها داریم کد HTML که با (#) آغاز می شه و شامل شش حرفه که این حروف رو اعداد 0 تا 9 و حروف الفبای انگلیسی از A تا F  تشکیل می دهند رنگ سفید #FFFFFF و رنگ مشکی#000000  می باشد و باقی رنگها بین اینم دو پارامتر

ادامه مطلب ...
del.icio.us  digg  newsvine  furl  Y!  smarking  segnalo

آموزش سایه دار کردن متن نوشته

پنج‌شنبه 29 اردیبهشت 1390 ساعت 20:07

یکی دیگر از امکانات CSS3 در استایل بندی تعریف کد سایه برای متون [Text-shadow] می باشد
این کد به ما اجازه می دهد افکتهای در خور توجهی به کلمات معمولی تایپ شده خود اضافه کنیم و در واقع کاربران را از این لحاظ از توسل به Photoshop یا رشته های پیچیده Javascriptبی نیاز می سازد
نمونه یک کد سده سایه برای متن:

< style  type=" text/css">
.text{text-shadow:1px 1px 2px #00f;color:#ff0;}
</style>

1.   اولین عدد فاصله سایه ما نسبت به محور xهاست هرچه به سمت پائین بیاییم عدد از صفر بالا می رود و هرچه بخواهیم بالا برویم از صفر کم می شود

2.عددد دوم فاصله تا محور Y هاست که به سمت راست زیاد و چپ کم می شود

3.عدد سوم قطر محوی سایه است

4.گزینه رنگ که به ازای مقدار داده شده رنگ سایه را معین می کند

در ادامه مطلب نمونه ها و کدها را ببینید

ادامه مطلب ...
del.icio.us  digg  newsvine  furl  Y!  smarking  segnalo

فونت آنلاین بسم الله

سه‌شنبه 27 اردیبهشت 1390 ساعت 17:57
C

به بسم الله فوق نگاه کنید این کلمه یک فونت است که وبلاگ  CSS3 با استفاده از قابلیت های جدید استایل بندی چندین نمونه آنرا در اختیار شما می گذارد

مهمترین خاصیت لینک به فونت این است که از هر سیستمی سایت شما خوانده شود این فونت را می بیند و نیازی به نصب فونت ندارد همینطور وزن پایین فونت و در مقابل کیفیت بالاتر تا حد دلخواه از دیگر مزیت ها هستند به نحوی که به اندازه ای که برای font-size مقدار تعریف کنید می توانید نوشته را بزرگ یا کوچک نمایید

نحوه قرار دادن در ادامه مطلب معادل کلیه حروف انگلیسی کوچک و بزرگ برای این فونت مشخص شده است  و دو پنجره کد یکی برای بخش HEAD – Style ویا صفحه CSS و دیگری در محل مورد نظر و در تگ های BODY

  ابتدا کد شماره یک را کپی و جاگذاری نمایید

ادامه مطلب ...
del.icio.us  digg  newsvine  furl  Y!  smarking  segnalo

جعبه سخنگو یا Hint

شنبه 10 اردیبهشت 1390 ساعت 09:05


در این پست با استفاده از یکی از قابلیت های CSS3 یک جعبه هوشمند (Hint) طراحی می کنیم

دستور مورد استفاده  transition از دستورات حرکتی استایل بندیه و با پارامترهای موضوع (آیتم متحرک در شی) / مدت زمان انجام حرکت  / مسیر یا نوع حرکت / مدت زمان ایست قبل از حرکت /  تنظیم می شه در این جلبسه ما گزینه اختیارات رو بر روی all قرار داده مدت زمانی برای مکث تعریف نکردیم و به گزینه زمان انجام حرکت  اکتفا کردیم این دستور در نشانگرهای مختلف تعاریف گوناگونی داره :

ادامه مطلب ...
del.icio.us  digg  newsvine  furl  Y!  smarking  segnalo

ساخت یک کرکره نمایش مطلب (متحرک)

سه‌شنبه 6 اردیبهشت 1390 ساعت 15:43

روش ساخت صفحه نمایش متن با افکت کرکره با استفاده از css3 و JavaScript
با کلیک بر روی گزینه ها ابتدا تفاوت های موجود را مشاهده نمایید 

به ادامه مطلب مراجعه فرمائید

ادامه مطلب ...
del.icio.us  digg  newsvine  furl  Y!  smarking  segnalo

آلبوم عکس ساده و جالب

جمعه 2 اردیبهشت 1390 ساعت 21:41

امروز قصد دارم ساخت یک البوم عکس ساده و در غین حال کار آمد رو آموزش بدم
شما به وسیله این آلبوم می تونید بجای عکس های بزرگ عکس هایی با اندازه کوچک و کم حجم را نمایش بدید و با قرار گرفتن موس روی عکس ها تصویر اصلی ظاهر  شود

به تصاویر زیر دقت کنید


آموزش در ادامه مطلب

ادامه مطلب ...
del.icio.us  digg  newsvine  furl  Y!  smarking  segnalo
   1       2    >>