» » Начальный index.html
93 0  

Начальный index.html

Создание шаблона начинается из заготовки уже готового документа html.
У каждого верстальщика свои способы начать верстать, так как я верстаю в большентве под DLE, то и со временем выробатался свой метод начала работы.

К начальной странице в 99% я подключаю три файла стилей (в конце можно их обьединить в один файл.)
 "styles.css"  

"sitka.css"

"nuz.css"

=====

Содержание файла - index.html

<!doctype html>
<html lang="uk">
<head>
	<meta charset="utf-8">
	<meta name="viewport" content=" initial-scale=1.0, width=device-width" />
	<title>Название</title>
	<!-- - --> 
	<link href="css/styles.css" rel="stylesheet" type="text/css" />
	<link href="css/sitka.css" rel="stylesheet" type="text/css" />
	<link async href="css/nuz.css" rel="stylesheet" type="text/css" />
	<link rel='dns-prefetch' href='//fonts.googleapis.com' /> 
	<link href="https://fonts.googleapis.com/css?family=Roboto+Condensed:300,300i,400" rel="stylesheet">
</head>

<body itemscope itemtype="http://schema.org/WebPage">

	<header itemscope itemtype="http://schema.org/WPHeader">	
		<!-- Navigacia */-->
		<nav itemscope itemtype="https://www.schema.org/SiteNavigationElement">
			<ul class="menu">
			<li itemprop="name"><a itemprop="url" href="http://">главная</a></li>
			<li itemprop="name"><a itemprop="url" href="http://">автор</a></li>
			</ul>
		</nav>
		<!-- DLE kroshki */-->
		<div class="speedbar"><div class="over"><span id="dle-speedbar"><span itemscope="" itemtype="http://data-vocabulary.org/Breadcrumb"><a href="https://rullan.in.ua/" itemprop="url"><span itemprop="title">Головна</span></a></span> » <span itemscope="" itemtype="http://data-vocabulary.org/Breadcrumb"><a href="https://rullan.in.ua/veb/" itemprop="url"><span itemprop="title">Блог</span></a></span> » Яскраві дизайни сайтів.</span></div></div>

	</header>
	
<!--
	
		<div class="row">
			<div class="col-16">

			</div>
			<div class="col-66">

			</div>
			<div class="col-18">

			</div>
		</div>
			
*/-->
			
	<footer itemscope itemtype="http://schema.org/WPFooter">
		<s itemprop="copyrightHolder"><a title="Ресторан-корчма Три Ставки" href="/" itemprop="url">Ресторан-корчма "Три Ставки"</a></s>
			<s itemprop="copyrightYear">2016</s> - 2018  © All Rights Reserved.
	</footer>
	
	<script src="js/jquery-DLE13-1.js"></script>
	<script>   /* menu 1 - fiksacia */
		$(document).ready(function(){ var $menu = $("#nav-rull"); $(window).scroll(function(){ if ( $(this).scrollTop() > 55 && $menu.hasClass("remfix") ){ $menu.removeClass("remfix").addClass("fixed-rull"); } else if($(this).scrollTop() <= 55 && $menu.hasClass("fixed-rull")) { $menu.removeClass("fixed-rull").addClass("remfix"); }  });scroll });
	</script> 
</body>

</html>

<!-- Stvoreno - rullan.in.ua - 2019 -->

<!--  ДОДАТКОВІ ЕЛЕМЕНТИ:

		<ul class="shapplah">
			<li><i class="pl_tel"></i>мммммм</li>
			<li><i class="pl_ikvulg"></i>ммммммм</li>
			<li><i class="pl_ikmenu"></i>мммм</li>
		</ul>


	<div class="clear str-10"></div>

	/* VIDEO html5 */
	<video autoplay loop poster="video/rest.jpg" id="video-fon">
		<source src="video/rest.mp4" type="video/mp4">
		<source src="video/rest.webm" type="video/webm">
		<source src="video/rest.ogv" type="video/ogg">
	</video>	



		<img src="images/11news.jpg" alt="" />

		<div class="col-60">
			<a href="/">Головна</a>
			<a href="">Меню</a>
			<a href="" >Замовити&nbsp;столик</a>
			<a href="">Банкетний&nbsp;зал</a>
			<a href="">Фотоальбом</a>
			<a href="" >Контакти</a>
		</div>

	
	
				/* SOCKNOPKI */
				<div class="social" data-url="{full-link}" data-title="{title}" data-desc="{full-story limit="122"}">
						<a class="push facebook" data-id="fb"><i class="bg-sunfcb"></i></a>
						<a class="push twitter" data-id="tw"><i class="bg-suntvit"></i></a>							
						<a class="push google" data-id="gp"><i class="bg-sungogl"></i></a>							
				</div>	

					/* DLE search */
					<form id="q_search" method="post">						
						<input id="story" name="story" placeholder="Поиск по сайту..." type="search">
						<button type="submit" title="Виконати пошук"><u>⇝</u></button>
						<a  href="/index.php?do=search&amp;mode=advanced" title="Расширенный поиск">Расширенный поиск</a>
						<input type="hidden" name="do" value="search">
						<input type="hidden" name="subaction" value="search">
					</form>
 -->

Оставить свой комментарий:

Опыт в веб разработке:

2009
2010
2011
2012
2013
2014
2015
2016
2017
2018
2019
2020
2021
2022
2023
2024
2025
2026
2027
2028
1979
2019