DartsDiffusionProject

ダーツ普及計画

テスト

/*002_合わせて読みたいブログ*/

合わせて読みたい

 

ここにタイトル

/*HTML*/

/*002_合わせて読みたいブログ*/
<a href="ここにURL" class="blogCard2_con">
<div class="blogCard2">
<p class="blogCard2_title">合わせて読みたい</p>
<div class="blogCard2_left" style="background-image: url(ここにサムネイル画像のURL);"></div>
<div class="blogCard2_right">
<p class="blogCard2_subTitle">ここにタイトル</p>
</div>
</div>
</a>

/*003_リスト*/

/*HTML*/

/*003_リスト*/
<div class="nomadList3">
<ul>
<li>リスト1</li>
<li>リスト2</li>
<li>リスト3</li>
</ul>
</div>

/*004_ボタン*/

/*HTML*/

/*004_ボタン*/
<div class="nomadBtn_deco5">
<a href="#">ボタン</a>
</div>

/*005_吹き出し*/

ここに右のチャット文1

名前
 
名前
 

ここに左のチャット文1

ここに右のチャット文2

名前
 
名前
 

ここに左のチャット文2

/*HTML*/

/*005_吹き出し*/
<div class="speechBox">
<!--★右のチャットはここから-->
<div class="comRight">
<div class="speechCom">
<p>ここに右のチャット文1</p>
</div>  
<div class="speechImg_con">
<div class="speechName">名前</div>
<div class="speechImg" style="background-image: url(アイコンの画像URL)"></div>
</div>
</div>
<!--★ここまで-->

<!--☆左のチャットはここから-->
<div class="comLeft">
<div class="speechImg_con">
<div class="speechName">名前</div>
<div class="speechImg" style="background-image: url(アイコンの画像URL)"></div>
</div>
<div class="speechCom">
<p>ここに左のチャット文1</p>
</div>
</div>
<!--☆ここまで-->

<!--★右のチャットはここから-->
<div class="comRight">
<div class="speechCom">
<p>ここに右のチャット文2</p>
</div>
<div class="speechImg_con">
<div class="speechName">名前</div>
<div class="speechImg" style="background-image: url(アイコンの画像URL)"></div>
</div>
</div>
<!--★ここまで-->

<!--☆左のチャットはここから-->
<div class="comLeft">
<div class="speechImg_con">
<div class="speechName">名前</div>
<div class="speechImg" style="background-image: url(アイコンの画像URL)"></div>
</div>
<div class="speechCom">
<p>ここに左のチャット文2</p>
</div>
</div>
<!--☆ここまで-->
</div>

/*006_テーブル*/

製品名 タイトル1 タイトル2 タイトル3 タイトル4 タイトル5
1行目製品名 1行目タイトル1の内容 1行目タイトル2の内容 1行目タイトル3の内容 1行目タイトル4の内容 1行目タイトル5の内容
2行目製品名 2行目タイトル1の内容 2行目タイトル2の内容 2行目タイトル3の内容 2行目タイトル4の内容 2行目タイトル5の内容
3行目製品名 3行目タイトル1の内容 3行目タイトル2の内容 3行目タイトル3の内容 3行目タイトル4の内容 3行目タイトル5の内容
4行目製品名 4行目タイトル1の内容 4行目タイトル2の内容 4行目タイトル3の内容 4行目タイトル4の内容 4行目タイトル5の内容
5行目製品名 5行目タイトル1の内容 5行目タイトル2の内容 5行目タイトル3の内容 5行目タイトル4の内容 5行目タイトル5の内容

/*HTML*/

/*006_テーブル*/
<table class="nomad_table">
<tbody>
<tr>
<th>製品名</th>
<th>タイトル1</th>
<th>タイトル2</th>
<th>タイトル3</th>
<th>タイトル4</th>
<th>タイトル5</th>
</tr>
<tr>
<td>
<a href="リンク先" target="_blank">
<img src="画像のURL" class="table_img">
1行目製品名
</a>
</td>
<td>1行目タイトル1の内容</td>
<td>1行目タイトル2の内容</td>
<td>1行目タイトル3の内容</td>
<td>1行目タイトル4の内容</td>
<td>1行目タイトル5の内容</td>
</tr>
<tr>
<td>
<a href="リンク先" target="_blank">
<img src="画像のURL" class="table_img">
2行目製品名
</a>
</td>
<td>2行目タイトル1の内容</td>
<td>2行目タイトル2の内容</td>
<td>2行目タイトル3の内容</td>
<td>2行目タイトル4の内容</td>
<td>2行目タイトル5の内容</td>
</tr>
<tr>
<td>
<a href="リンク先" target="_blank">
<img src="画像のURL" class="table_img">
3行目製品名
</a>
</td>
<td>3行目タイトル1の内容</td>
<td>3行目タイトル2の内容</td>
<td>3行目タイトル3の内容</td>
<td>3行目タイトル4の内容</td>
<td>3行目タイトル5の内容</td>
</tr>
<tr>
<td>
<a href="リンク先" target="_blank">
<img src="画像のURL" class="table_img">
4行目製品名
</a>
</td>
<td>4行目タイトル1の内容</td>
<td>4行目タイトル2の内容</td>
<td>4行目タイトル3の内容</td>
<td>4行目タイトル4の内容</td>
<td>4行目タイトル5の内容</td>
</tr>
<tr>
<td>
<a href="リンク先" target="_blank">
<img src="画像のURL" class="table_img">
5行目製品名
</a>
</td>
<td>5行目タイトル1の内容</td>
<td>5行目タイトル2の内容</td>
<td>5行目タイトル3の内容</td>
<td>5行目タイトル4の内容</td>
<td>5行目タイトル5の内容</td>
</tr>
</tbody>
</table>

/*009_ボックス*/

ここに文章

/*HTML*/

/*009_ボックス*/
<div class="nomadBox3">
<p>ここに文章</p>
</div>