alt-karate

## index.html
<div class="wrap">
	<div class="bg"></div>
</div>

## common.js
// ハンバーガーメニュー内のリンククリック時、ハンバーガーメニューを閉じます
$('#sp_nav a[href]').on('click', function(event) {
    $('#js_buttonHamburger').trigger('click');
});

## memo
Dreamweaverのテンプレートは、タグの一部を編集可能領域にできます(属性を編集可能領域にする)。
今回のsrcset属性で指定したパスについても、テンプレートから見たファイルパスを編集可能な属性の初期値しとして設定すると、子供のHTML上ではテンプレートから辿ったパスの情報が予め設定された状態になっています。


親のテンプレートファイル上で 各sourceタグをマウス選択し、メニュー > ツール > テンプレート > 属性を編集可能にする... をクリックします。


以下のようなダイアログが表示されますので、「SRCSET」属性を選択し、ラベルに任意の名称を設定します。タイプを「URL」にし、初期値はテンプレート上のファイルパスを記述します。

## common.dwt
//DWTファイルのHEAD内に"top"プロパティ定義
<!-- TemplateParam name="top" type="boolean" value="false" -->

//サイトタイトルの分岐
<!-- TemplateBeginIf cond="top" --><h1>サイトタイトル</h1><!-- TemplateEndIf -->
<!-- TemplateBeginIf cond="!top" --><p>サイトタイトル</p><!-- TemplateEndIf -->

## index.html
<div>
  <img src="images.jpg" alt="">
  <p>テキストテキスト…</p>
</div>

<footer>footer</footer>

## style.css
.privay_list > li {
  counter-increment: privayNum;
}

.privay_list > li .privay_item_title::before {
  content: counter(privayNum) ".";
}

## index.html
<i class="arrow-icon"></i>

## hoge
// 下記名前の空レイヤーを作成
default 100% + 200% @2x

## index.html
<!-- srcset属性 -->
<img src="sample.jpg" srcset="sample@2x.jpg 2x" alt="画像">

<!-- sizes属性 -->
<img srcset="sample-320w.jpg 320w, sample-480w.jpg 480w, sample-800w.jpg 800w" sizes="(max-width: 320px) 280px, (max-width: 480px) 440px, 800px" src="sample-800w.jpg" alt="画像">

<!-- picture要素（画像の切り替え） -->
<picture>
  <source media="(max-width: 799px)" srcset="sample-480w-sp.jpg">
  <source media="(min-width: 800px)" srcset="sample-800w.jpg">

## untitled
０j亜唖娃阿哀愛挨姶逢葵茜穐悪握渥旭葦芦鯵梓圧斡扱宛姐虻飴絢綾鮎或粟袷安庵按暗案闇鞍杏以伊位依偉囲夷委威尉惟意慰易椅為畏異移維緯胃萎衣謂違遺医井亥域育郁磯一壱溢逸稲茨芋鰯允印咽員因姻引飲淫胤蔭院陰隠韻吋右宇烏羽迂雨卯鵜窺丑碓臼渦嘘唄欝蔚鰻姥厩浦瓜閏噂云運雲荏餌叡営嬰影映曳栄永泳洩瑛盈穎頴英衛詠鋭液疫益駅悦謁越閲榎厭円園堰奄宴延怨掩援沿演炎焔煙燕猿縁艶苑薗遠鉛鴛塩於汚甥凹央奥往応押旺横欧殴王翁襖鴬鴎黄岡沖荻億屋憶臆桶牡乙俺卸恩温穏音下化仮何伽価佳加可嘉夏嫁家寡科暇果架歌河火珂禍禾稼箇花苛茄荷華菓蝦課嘩貨迦過霞蚊俄峨我牙画臥芽蛾賀雅餓駕介会解回塊壊廻快怪悔恢懐戒拐改魁晦械海灰界皆絵芥蟹開階貝凱劾外咳害崖慨概涯碍蓋街該鎧骸浬馨蛙垣柿蛎鈎劃嚇各廓拡撹格核殻獲確穫覚角赫較郭閣隔革学岳楽額顎掛笠樫橿梶鰍潟割喝恰括活渇滑葛褐轄且鰹叶椛樺鞄株兜竃蒲釜鎌噛鴨栢茅萱粥刈苅瓦乾侃冠寒刊勘勧巻喚堪姦完官寛干幹患感慣憾換敢柑桓棺款歓汗漢澗潅環甘監看竿管簡緩缶翰肝艦莞観諌貫還鑑間閑関陥韓館舘丸含岸巌玩癌眼岩翫贋雁頑顔願企伎危喜器基奇嬉寄岐希幾忌揮机旗既期棋棄機帰毅気汽畿祈季稀紀徽規記貴起軌輝飢騎鬼亀偽儀妓宜戯技擬欺犠疑祇義蟻誼議掬菊鞠吉吃喫桔橘詰砧杵黍却客脚虐逆丘久仇休及吸宮弓急救朽求汲泣灸球究窮笈級糾給旧牛去居巨拒拠挙渠虚許距鋸漁禦魚亨享京供侠僑兇競共凶協匡卿叫喬境峡強彊怯恐恭挟教橋況狂狭矯胸脅興蕎郷鏡響饗驚仰凝尭暁業局曲極玉桐粁僅勤均巾錦斤欣欽琴禁禽筋緊芹菌衿襟謹近金吟銀九倶句区狗玖矩苦躯駆駈駒具愚虞喰空偶寓遇隅串櫛釧屑屈掘窟沓靴轡窪熊隈粂栗繰桑鍬勲君薫訓群軍郡卦袈祁係傾刑兄啓圭珪型契形径恵慶慧憩掲携敬景桂渓畦稽系経継繋罫茎荊蛍計詣警軽頚鶏芸迎鯨劇戟撃激隙桁傑欠決潔穴結血訣月件倹倦健兼券剣喧圏堅嫌建憲懸拳捲検権牽犬献研硯絹県肩見謙賢軒遣鍵険顕験鹸元原厳幻弦減源玄現絃舷言諺限乎個古呼固姑孤己庫弧戸故枯湖狐糊袴股胡菰虎誇跨鈷雇顧鼓五互伍午呉吾娯後御悟梧檎瑚碁語誤護醐乞鯉交佼侯候倖光公功効勾厚口向后喉坑垢好孔孝宏工巧巷幸広庚康弘恒慌抗拘控攻昂晃更杭校梗構江洪浩港溝甲皇硬稿糠紅紘絞綱耕考肯肱腔膏航荒行衡講貢購郊酵鉱砿鋼閤降項香高鴻剛劫号合壕拷濠豪轟麹克刻告国穀酷鵠黒獄漉腰甑忽惚骨狛込此頃今困坤墾婚恨懇昏昆根梱混痕紺艮魂些佐叉唆嵯左差査沙瑳砂詐鎖裟坐座挫債催再最哉塞妻宰彩才採栽歳済災采犀砕砦祭斎細菜裁載際剤在材罪財冴坂阪堺榊肴咲崎埼碕鷺作削咋搾昨
	// ハンバーガーメニュー内のリンククリック時、ハンバーガーメニューを閉じます
	$('#sp_nav a[href]').on('click', function(event) {
	$('#js_buttonHamburger').trigger('click');
	});
	Dreamweaverのテンプレートは、タグの一部を編集可能領域にできます(属性を編集可能領域にする)。
	今回のsrcset属性で指定したパスについても、テンプレートから見たファイルパスを編集可能な属性の初期値しとして設定すると、子供のHTML上ではテンプレートから辿ったパスの情報が予め設定された状態になっています。


	親のテンプレートファイル上で各sourceタグをマウス選択し、メニュー > ツール > テンプレート > 属性を編集可能にする... をクリックします。



	以下のようなダイアログが表示されますので、「SRCSET」属性を選択し、ラベルに任意の名称を設定します。タイプを「URL」にし、初期値はテンプレート上のファイルパスを記述します。
	//DWTファイルのHEAD内に"top"プロパティ定義
	<!-- TemplateParam name="top" type="boolean" value="false" -->

	//サイトタイトルの分岐
	<!-- TemplateBeginIf cond="top" --><h1>サイトタイトル</h1><!-- TemplateEndIf -->
	<!-- TemplateBeginIf cond="!top" --><p>サイトタイトル</p><!-- TemplateEndIf -->
	<div>
	<img src="images.jpg" alt="">
	<p>テキストテキスト…</p>
	</div>

	<footer>footer</footer>
	.privay_list > li {
	counter-increment: privayNum;
	}

	.privay_list > li .privay_item_title::before {
	content: counter(privayNum) ".";
	}
	// 下記名前の空レイヤーを作成
	default 100% + 200% @2x
	<!-- srcset属性 -->
	<img src="sample.jpg" srcset="sample@2x.jpg 2x" alt="画像">

	<!-- sizes属性 -->
	<img srcset="sample-320w.jpg 320w, sample-480w.jpg 480w, sample-800w.jpg 800w" sizes="(max-width: 320px) 280px, (max-width: 480px) 440px, 800px" src="sample-800w.jpg" alt="画像">

	<!-- picture要素（画像の切り替え） -->
	<picture>
	<source media="(max-width: 799px)" srcset="sample-480w-sp.jpg">
	<source media="(min-width: 800px)" srcset="sample-800w.jpg">