Question

基本上,当我发布新闻时,我想到的冰景似乎覆盖了整个宽度和高度。我也希望这一跨段元素能够占其母集装箱的100%,其类别名称为“冰”。

这里是我的联合材料:

const btn=document.querySelector("button")
const player=document.querySelectorAll( .player )


player.forEach(player=> {
  diceDiv=document.createElement("div")
  span=document.createElement("span")
  player.appendChild(diceDiv)
  diceDiv.appendChild(span)
})



const diceRoll=(span)=> {
  let numOfDots = Math.floor(Math.random() * 6) + 1  
  span.innerHTML= &#9856 
}


btn.addEventListener( click , ()=> {
  player.forEach(player=> player.firstElementChild.classList.add("dice"))
  const spans=document.querySelectorAll( span )
  spans.forEach(span=> {
    diceRoll(span)
  })
})

然而,我试图这样做,单条形冰面仍然出现在我四分五裂的底层。为什么如此?

Answer 1

I hope the main purpose of this game is JS and not CSS, After playing with your fiddle, If you add following properties to your span element, it would take the space of parent div i.e "dice"

display: inline-block;
font-size: 202px;
margin-top: -72px;

友情链接