下面是一个示例代码,展示了如何使用HTML、CSS和JavaScript来创建一个按钮,点击该按钮可以折叠带有图像和文本对齐的div
元素:
HTML:
这是一段文本。
CSS:
#myDiv {
display: none; /* 默认隐藏div */
}
img {
width: 100px;
}
p {
margin-left: 10px;
}
JavaScript:
function toggleDiv() {
var div = document.getElementById("myDiv");
if (div.style.display === "none") {
div.style.display = "block";
} else {
div.style.display = "none";
}
}
在上面的示例中,点击按钮时会调用toggleDiv()
函数,该函数会获取myDiv
元素,并检查其display
属性。如果display
属性为none
(即div被隐藏),则将其设置为block
(即显示div)。如果display
属性为block
(即div可见),则将其设置为none
(即隐藏div)。
你可以根据需要修改CSS样式和JavaScript函数,以使其适应你的具体需求。
下一篇:按钮一直停留在左侧