دانلود قالب Royal Crown+ نسخه ی BTS

آموزش مقدماتی طراحی قالب وبلاگ

آموزش grid قسمت دوم

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

۴۷ مطلب توسط «سید علی طلوع» ثبت شده است

نسخه ی دوستونه ی قالب ستون (واکنش گرا)

قالب ستون یکی از زیبا ترین قالب های بلاگ بیان است، این قالب به طور پیش فرض در یک ستون قرار دارد ولی نسخه ی جدید که توست تیم ویرا قالب ویرایش شده دارای دو ستون و واکنش گرا هست.

برای مشاهده ی پیشنمایش زنده اینجا کلیک کنید

همانطور که دیدید این قالب در عین سادگی و استفاده از چند رنگ ساده بسیار زیبا هست.

ویزگی های این قالب: سرعت لود عالی، واکنش گرا، دارای بالابر نرم، فونت یکان، رنگ بندی آرامش بخش، استقاده از ایکون های زیبا و چندین ویژگی دیگر

کار های این قالب تموم شده، من خدایی واسه این قالب زحمت کشیدم بیشتر ریزه کاری ها شو انجام دادم ولی چیزی نمی خوام جز این که این قالب رو منتشر کنید و لینک لینک این صفحه رو قرار در وبلاگتون قرار بدید.

لینک دانلود به دستور کارگروه مصادقین مجرمانه حذف گردید

شوخی کردم

استفاده کردی نظر بزار

برای دانلود اینجا کلیک کنید

دانلود قالب واکنش گرا شده ی تنش

دانلود قالب واکنش گرا شده ی تنش

قالب تنش قالبی زیبا با پس زمینه ای تیره هست . متاسفانه این قالب واکنش گرا نیست ولی به دست ما واکنش گرا شده.

ویژگی ها ی اضافه شده : واکنش گرا در چند قالب / بالا بر نرم بدون جاوا اسکریپت / اضافه شدن فونت وزیر/ عوض شدن هدر / حجم کم و چندین ویژگی جدید.

.

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

آخرین بروز رسانی: ۱۶ / ۳ / ۱۳۹۹

.

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

.

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

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

قالب ایران قالبی دوستونه زیبا و سایده هست . متاسفانه این قالب در حالب پیش فرض واکنش گرا نیست ولی امروز به دست ما واکنش گرا شده.

آخرین بروز رسانی: ۱۶ / ۳ / ۱۳۹۹

پیش نمایش در حالب دسکتاپ

پیش نمایش در حالب مبایل

ویزگی های اضافه شده : واکنش گرا بودن ، اضافه شدن فونت وزیر ، اضافه شدن بالابر بدون جاوا اسکریپت و . . .

دانلود قالب اسمارتاف

قالب اسمارتاف قالب وبلاگ قبلی من هست که میتونید دموی اون رو در لینک زیر ببینید.

ویزگی های قالب: واکنش گرا نسبت به اندازه ی صفحه، بالابر نرم، بهینه شده، دارای فونت وزیر، و . . .

.

آخرین بروز رسانی: ۱۶ / ۳ / ۱۳۹۹

مشاهده دمو

برای دانلود قالب اسمارتاف اینجا کلیک کنید

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

 

آموزش عبارات با قاعده

دانلود pdf آموزش عبارات با قاعده در java script

منبع pdf: روکسو

تغییر رنگ آدرس بار در اندروید

برای تغییر رنگ ادرس بار شما در تگ <head> متا تگ زیر را قرار دهید:

<meta name="theme-color" content="#yor_favorite_color">

فقط بجای #yor_desired_color رنگ مورد نظرتون رو وارد کنید مثال:

<meta name="theme-color" content="#FF3600">

نتیجه: می شود

اسکریپت لینک کوتاه

سلام اول از همه وارد این ادرس بشید. s80h.ir/bf.html
لینک بالا لینک کوتاه blogfont.blog.ir هست.
ساخت این لینک کوتاه خیلی ساده هست. به کد زیر نگاه کنید

<script>
	var gotourl = window.open('http://blogfont.blog.ir',"_self");
</script>

کلا یه خط جاوا اسکریپت هست، ولی جز لینک کوتاه کار دیگه مثل شمارش و از اینجور چیزا نمیکنه.

اگر می خواهید بعد جند سانیه این کار رو بکنه باید کد زیر رو وارد کنید
 

<script>
	var go = setTimeout(function(){link()} , 2000);
	function link(){
		var gotourl = window.open('http://blogfont.blog.ir',"_self");
	}
</script>

برای تغییر زمان لینک کوتاه مقدار "2000" رو به عدد دلخواه تغییر دهید. (عدد مورد نظر حتما باید به میلی سانیه باشه)

استفاده از دستور !important +آپدیت

آپدیت در اخر مطلب

طراحان با تجربه، از کاربرد این دستور اطلاع دارند، اما معمولا تازه کارها، از این دستور !important در CSS بی اطلاع هستند و تعجب می کنند. با افزودن دستور !important به انتهای دستور css تان، اولویت دستور مورد نظر را نسبت به دستورات دیگر که با آن در تضاد هستند، افزایش می دهید.
در کد زیر، رنگ زمینه، به دلیل وجود !important آبی خواهد بود (و نه قرمز)

.page {
  background-color: blue !important;
  background-color: red;
}

کاربرد روش فوق وقتی است که شما یک css rule می نویسید، اما متوجه می شوید که هیچ تاثیری ندارد! دلیل این مسئله احتمالا این است که یک دستور دیگر با اولویت بالاتر وجود دارد که اثر دستور شما را خنثی می کند.
برای این که دستور شما اولویت بالا تری داشته باشد و اثر دستورات دیگر را خنثی کند، می توانید از !important استفاده کنید.

.

.

اپدیت: این دستور وقتی استفاده میشه ک نخوایم ارث بری اتفاق بیفته

+اپدیت رو من (صدرا) نوشتم

کد دکمه ی دانلود

مستفیم سر اصل مطلب:

کد های زیر رو در بخش ویرایش css قالب فعلی بزارید 

.btndl {
    background: #00AF66;
    border: 5px solid #07563E;
    border-radius:20px;
    padding: 4px 16px;
    color: #fff !important;
    font-size: 20px;
    text-decoration: none;
    display: inline-block;
    transition: all .4s;
}.btndl:hover {box-shadow: 0 0 10px #00AF66}

بعد به لینکی که می خواهید شبیه دکمه ی دانلود بشه کلاس "btndl" بدید، مثال: 

<a href="#dl" class="btndl">دانلود</a>

نتیجه ی کد بالا :

دانلود

آموزش استفاده از Font Awesome

ابتدا شما باید به سایت "سافت 98" بروید و "Font Awesome" رو دانلود کنید، از فایل فشرده دربیارید و به پوشه ی "FontAwesome.Pro.5.13.0.Web\css" و فایل "all.min.css" رو فضای اختصاصی وبلاگتون جای گذاری گنید .

اگر هم می خواهید به صورت افلاین استفاده کنید فایل "all.min.css" در مکان دلخاه جای گذاری کنید.

خب ،،، یه فایل "html" درست کنید و در تگ "<head>" کد زیر را بزارید.

<link rel="stylesheet" type="text/css" href="Your css file link">

قبلی ۱ ۲ ۳ ۴ ۵ بعدی
ویرا قالب

سفارشات خود را از بخش سفارشات در منوی بالا دریافت کنید

مطالب پیشنهادی
طبقه بندی موضوعی
خلاصه آمار
کلمات کلیدی
قالب واکنش گرا js java script Animate.css grid در html grid در css grid in html grid in css grid css grid تکنیکcss جاوااسکریپت جاوا css فونت برای وبلاگ فونت font متغیر ها روش نوشتن متغیر روش فراخانی متغیر جاواسکریپت java قالب وبلاگ قالب بلاگ بیان html کتابخانه فریم ورک Animate Font Awesome دکمه ی دانلود
تبادل لینک