HTML 笔记

                     

贡献者: addis

  • 本文处于草稿阶段。

代码 1:test.html
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
</head>
<body>
    <!-- 内容 -->
</body>
</html>

   常识:

转义字符

1. <input> 输入框属性

   这是为了重新实现 mathtype 网页编辑器的一个努力,还需要用 JS 实现输入框随内容变长

图
图 1:显示效果(可以作为分子或分母或上下标的输入框)

代码 2:input_box.html
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Input Box Example</title>
	<style>
		#myInput {
			/* Positioning relative to the nearest positioned ancestor */
			position: absolute;
			/* 100px from the top of the nearest positioned ancestor */
			top: 100px;
			/* 200px from the left of the nearest positioned ancestor */
			left: 200px;
			/* Width of the input box */
			width: 50px;
			/* Height of the input box */
			height: 20px;
			/* Size of the text inside the input box */
			font-size: 18px;
			/* Horizontally center text */
			text-align: center;
			/* Remove padding to avoid text misalignment */
			padding: 0;
			/* Vertically center the text by matching line height to box height */
			line-height: 50px;
			/* Dashed gray border, color #808080 */
			border: 2px dashed #808080;
			/* Removes any focus outline the browser might apply */
			outline: none;
			/* Ensures no shadow effects are applied */
			box-shadow: none;
		}
	</style>
</head>
<body>
	<input id="myInput" type="text" placeholder="">

	<script>
		// Automatically focus the input box when the page loads
		window.onload = function() {
			document.getElementById('myInput').focus();
		};
	</script>
</body>
</html>


致读者: 小时百科一直以来坚持所有内容免费无广告,这导致我们处于严重的亏损状态。 长此以往很可能会最终导致我们不得不选择大量广告以及内容付费等。 因此,我们请求广大读者热心打赏 ,使网站得以健康发展。 如果看到这条信息的每位读者能慷慨打赏 20 元,我们一周就能脱离亏损, 并在接下来的一年里向所有读者继续免费提供优质内容。 但遗憾的是只有不到 1% 的读者愿意捐款, 他们的付出帮助了 99% 的读者免费获取知识, 我们在此表示感谢。

                     

友情链接: 超理论坛 | ©小时科技 保留一切权利