输入m行数和n列数,在网页文档中打印用户输入的行数和列数的星星
时间: 2024-09-19 08:11:24 浏览: 41
python统计多维数组的行数和列数实例
在网页上打印用户输入的行数和列数的星星,通常可以使用HTML和JavaScript来实现。首先,你需要创建一个简单的HTML表单让用户输入行数和列数。然后,通过JavaScript处理用户的输入并动态生成星星图案。
以下是一个简化的示例:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<title>星星图案</title>
<style>
.star-row {
display: flex;
justify-content: space-between;
}
.star-cell {
width: 50px; /* 根据需要调整 */
text-align: center;
}
</style>
</head>
<body>
<h2>输入行数和列数:</h2>
<input type="number" id="rowsInput" placeholder="行数">
<input type="number" id="colsInput" placeholder="列数">
<button onclick="printStars()">生成星星</button>
<div id="output"></div>
<script>
function printStars() {
const rows = parseInt(document.getElementById('rowsInput').value);
const cols = parseInt(document.getElementById('colsInput').value);
let output = '<div class="star-row">';
for (let i = 0; i < rows; i++) {
let row = '';
for (let j = 0; j < cols; j++) {
if (i === 0 || i === rows - 1 || j === 0 || j === cols - 1) { // 边缘
row += '*';
} else {
row += ' ';
}
}
output += `<span class="star-cell">${row}</span>`;
if (i !== rows - 1) { // 每行之间换行
output += '</div><div class="star-row">';
}
}
document.getElementById('output').innerHTML = output + '</div>';
}
</script>
</body>
</html>
```
在这个例子中,用户输入行数和列数后点击“生成星星”按钮,会动态地在`<div id="output">`处显示由星号(*)组成的相应大小的矩阵。
阅读全文