motsu0

<!-- 左カラム(固定幅)、右カラム(可変幅) -->
<div class="parent">
  parent
  <dl class="sample3">
    <dt class="lc">吾輩は猫である</dt>
    <dd class="rc">吾輩は猫である。名前はまだ無い。<br>どこで生れたかとんと見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。</dd>
    <dt class="lc">坊っちゃん</dt>
    <dd class="rc">親譲りの無鉄砲で小供の時から損ばかりしている。小学校に居る時分学校の二階から飛び降りて一週間ほど腰を抜かした事がある。</dd>
  </dl>
  <div class="clear"></div>

motsu0

<!-- 左カラム(固定幅)、右カラム(残りの幅) -->
<p>1行の場合のみなら選択肢に入るか。</p>
<div class="parent">
  parent
  <dl class="sample4">
    <dt class="lc">吾輩は猫である</dt>
    <dd class="rc">吾輩は猫である。名前はまだ無い。<br>どこで生れたかとんと見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。</dd>
  </dl>
</div>

motsu0

//アラートのみ
window.alert('アラートのテキスト');

//選択肢付きアラート
//window.confirm('foo') => true or false
if(window.confirm('トップページへ戻りますか？')) location.href = '/';

motsu0

<input type="text" id="copy-text" value="これをコピーさせる"> <button id="bt-copy">copy</button>

motsu0

#parent{
  font-size: 0;
  letter-spacing: 0;
  text-align: center;
}
.cd-outer{
  display: inline-block;
  margin: 0 -28px;
  position: relative;
  perspective: 100px;

motsu0

<button id="bt-prac">長押しでアラート</button>
<p id="op-prac">.</p>

<script src="path/to/long-press.js"></script>

motsu0

function long_press(el,nf,lf,sec){
  let longclick = false;
  let longtap = false;
  let touch = false;
  let timer;
  el.addEventListener('touchstart',()=>{
    touch = true;
    longtap = false;
    timer = setTimeout(() => {
      longtap = true;

motsu0

.loop-area{
  width: 240px;
  margin: 0 auto;
  font-size: 0;
  letter-spacing: 0;
  line-height: 0;
  overflow: hidden;
}
.loop-box{
  width: 480px;

motsu0

#sample-img{
  display: block;
  width: 60%;
  margin: 0 auto;
}
#canvas{
  display: block;
  width: 30%;
  margin: 0 auto;
}

motsu0

#game-area{
  position: relative;
}
#play-area{
  padding: 15px 0;
  position: relative;
  user-select: none;
}
#play-area,#controller{
  background-color: #43A047;