div嵌套div，内部的div可拖动

可以使用HTML5中的draggable属性和JavaScript中的drag事件来实现内部的div可拖动。

首先，在内部的div中添加draggable属性，将其设置为true，表示可拖动。

<div class="outer">
  <div class="inner" draggable="true"></div>
</div>

然后，在JavaScript中，为内部的div添加dragstart、drag、dragend事件，分别表示拖动开始、拖动中和拖动结束。

var inner = document.querySelector('.inner');
inner.addEventListener('dragstart', function(event) {
  // 拖动开始时
  // 设置拖动的数据和效果
  event.dataTransfer.setData('text/plain', '拖动的文本');
  event.dataTransfer.effectAllowed = 'move';
});

inner.addEventListener('drag', function(event) {
  // 拖动中
  // 可以在这里实现拖动的效果
});

inner.addEventListener('dragend', function(event) {
  // 拖动结束
  // 可以在这里处理拖动结束后的逻辑
});

此外，还可以在外部的div中添加dragover、dragenter、dragleave和drop事件，来实现拖放的效果。

var outer = document.querySelector('.outer');
outer.addEventListener('dragover', function(event) {
  // 阻止默认的拖放行为
  event.preventDefault();
  // 设置允许的拖放效果
  event.dataTransfer.dropEffect = 'move';
});

outer.addEventListener('dragenter', function(event) {
  // 在拖动进入时添加样式
  outer.classList.add('dragover');
});

outer.addEventListener('dragleave', function(event) {
  // 在拖动离开时移除样式
  outer.classList.remove('dragover');
});

outer.addEventListener('drop', function(event) {
  // 阻止默认的拖放行为
  event.preventDefault();
  // 获取拖动的数据
  var data = event.dataTransfer.getData('text/plain');
  // 在drop事件中处理拖放的逻辑
});

通过以上的代码，就可以实现内部的div可拖动的效果了。当然，还可以根据具体的需求进行修改和优化。