3 سال پیش
1241

آموزش ایجاد سایت با بک گراند ویدیویی

به نام خدا و با عرض سلام خدمت کاربران عزیز زرین هور
امروز می خوایم نحوه ساخت یک سایت با بک گراند ویدیویی را به شما آموزش بدهیم در این آموزش ما از html و css استفاده می کنیم.

بک گراند ویدیویی

۱-اول از همه یک new folder با نام دلخواه مثلا bg می سازیم.
۲-در داخل فولدر دو فولدر دیگر با نام های cssوvideo ایجاد می کنیم.

۳-در داخل فولدر اصلی با نام bg یک فایل با فرمت html می سازیم و آن را با برنامه note pad ++ ویرایش می کنیم.

در داخل این فایل کد های زیر را می نویسیم:

<html lang="en">
	<head>
		<meta charset="UTF-8">
		<link rel="stylesheet" href="css/style.css">
		<title>zarrinhoor.com</title>
	</head>
	<body>
		<video class="video" autoplay muted loop>
			<source src="video/video.mp4">
		</video>	
	</body>
</html>

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

.video{
	position:fixed;
	z-index:1;
	width:auto%;
	height:auto%;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	min-height:100%;
	min-width:100%;
	
}

بعد از این کار در داخل فایل html و در بالای تگ <video> می نویسیم:

<div class="content">
		<h1>زرین هور بهترین سایت ایران در آموزش  رایگان</h1>
		<p>.............................................................
		............................ متن دلخواه ....................................
		................................................................
		</p>
	</div>

بعد از این وارد فایل cssمی شویم و می نویسیم:

.content{
	position:relative;
	color:#fff;
	width:800px;
	padding: 1em;
	margin:0 auto;
	z-index:2;
}

نکته: در این آموزش فایل ویدیویی ما در داخل فولدر، به نام video.mp4 بود.

ویدیوی آموزشی در زیر:

به زودی…

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

مطالب پر بازدید

ر
رمزگذاری درایو و فلش دیسک،رمزگذاری درایو و فلش ،رمزگذاری درایو ،رمزگذاری فلش دیسک،رمزگذاری ترفند،ترفند ویندوز

رمزگذاری درایو و فلش دیسک

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

ویرایش عکس،پایین آوردن حجم عکس،پایین آوردن حجم عکس بدون نویز،پایین آوردن حجم عکس بدون افت تصویر،ترفند ویرایش عکس،راه های مصرف کم اینترنت

راحت و رایگان بدون اُفت کیفیت حجم عکس هارو پایین بیار

تبدیل تمامی ارزهای دولتی و دیجیتالی به یکدیگر،تبدیل ارز،تبدیل پول، پول دولتی به دیجیتال،اخبار ارز،قیمت لحظه ای بازار،ابزارهای گوگل،رکود ارز،صعود ارز،ارزش پول کشورها

تبدیل تمامی ارزهای دولتی و دیجیتالی به یکدیگر

زیرنویس سازی فارسی و تمامی زبان ها در یوتیوب، زبان ها در یوتیوب

زیرنویس سازی فارسی و تمامی زبان ها در یوتیوب

2020

بهترین اپ های ساخت کلیپ برای اندروید