1 简单的测试页
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Test Page</title>
<style type="text/css">
* { margin: 0; padding: 0;}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
// Do stuff.
});
</script>
</head>
<body>
</body>
</html>
2 post数据到iframe
<form action="iframe.php" target="my-iframe" method="post">
<label for="text">一些文字：</标签>
<input type="text" name="text" id="text">
<input type="submit" value="post">
</ FORM>
<iframe name="my-iframe" src="iframe.php"> </ IFRAME>
3 左右两边布局
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Some Example from CSS-Tricks</title>
<style type="text/css">
* { margin: 0; padding: 0; }
p { padding: 10px; }
#left { position: absolute; left: 0; top: 0; width: 50%; }
#right { position: absolute; right: 0; top: 0; width: 50%; }
</style>
</head>
<body>
<div id="left">
<p>Left Half</p>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p>
</div>
<div id="right">
<p>Right Half</p>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p>
</div>
</body>
</html>
4 iframe加载时隐藏白页面
<iframe style="visibility:hidden;" onload="this.style.visibility = 'visible';" src="../examples/inlineframes1.html" > </iframe>
5 示例表单
<form id="myForm" action="#" method="post">
<div>
<label for="name">Text Input:</label>
<input type="text" name="name" id="name" value="" tabindex="1" />
</div>
<div>
<h4>Radio Button Choice</h4>
<label for="radio-choice-1">Choice 1</label>
<input type="radio" name="radio-choice-1" id="radio-choice-1" tabindex="2" value="choice-1" />
<label for="radio-choice-2">Choice 2</label>
<input type="radio" name="radio-choice-2" id="radio-choice-2" tabindex="3" value="choice-2" />
</div>
<div>
<label for="select-choice">Select Dropdown Choice:</label>
<select name="select-choice">
<option value="Choice 1">Choice 1</option>
<option value="Choice 2">Choice 2</option>
<option value="Choice 3">Choice 3</option>
</select>
</div>
<div>
<label for="textarea">Textarea:</label>
<textarea cols="40" rows="8" name="textarea"></textarea>
</div>
<div>
<label for="checkbox">Checkbox:</label>
<input type="checkbox" name="checkbox" />
</div>
<div>
<input type="submit" value="Submit" />
</div>
</form>
分享到：
相关推荐
一种基于网页特效的HTML代码片段.HTML
一、使用v-html v-html:更新元素的 innerHTML const text = `<p>Hello World</>` My name is Pjee <p v-html='text'></p> 注意：你的站点上动态渲染的任意 HTML 可能会非常危险，因为它很容易导致 XSS ...
1. **创建新类型的代码片段**：除了基本的文本片段，你可以扩展源码以支持更复杂的结构，比如XML、HTML或者SQL片段。 2. **个性化UI**：通过修改UI部分的源码，可以定制符合个人工作习惯的界面，例如调整颜色主题，...
在这个“html论坛代码大全”中，我们可以预见到包含了一系列适用于论坛环境的HTML代码片段，帮助用户在论坛上实现更丰富的展示效果，比如定制个性签名、增强帖子的视觉吸引力等。 在论坛环境中，HTML代码通常受到...
《SnippetStore：高效管理代码片段的桌面应用》 在当今快速发展的软件开发环境中，代码片段的管理和重用已经成为提升开发效率的重要手段。"SnippetStore"是一个专为开发者设计的桌面应用，它基于Electron框架，旨在...
它接收来自用户界面的配置信息，根据预设规则和用户选择，生成对应的CSS和HTML代码片段。 在使用这款工具时，首先需要确保开发环境安装了.NET Framework 3.5，这是工具运行的必要条件。然后，开发者可以通过解决...
这种工具对于学习、调试或快速预览HTML代码片段非常有帮助，尤其对于初学者和前端开发者来说，可以提高工作效率。 HTML（HyperText Markup Language）是用于创建网页的标准标记语言。它包含了一系列标签，这些标签...
**资源类型：** HTML代码片段 **科普风格概要介绍：** HTML星空代码是一段使用HTML和CSS编写的代码，用于在网页上创建一个动态的星空效果。这段代码通常包括一个`<div>`元素，其中包含了多个表示星星的`<span>`元素...
从给定的文件信息中，我们可以提炼出一系列关于jQuery的重要知识点，这50个代码片段不仅展示了jQuery的强大功能，还提供了实用的编程技巧，适用于各种JavaScript项目。以下是对部分代码片段的详细解释： ### 1. ...
本设计源码提供了一个基于Java和HTML的代码片段库，包含755个文件，其中包括560个java源文件，53个xml配置文件，37个yml配置文件，以及34个md文档。此外，还有13个png图片文件，10个html页面文件，9个js脚本文件，7...
- Emmet 是一个流行的前端开发工具，提供了 CSS 和 HTML 缩写的代码片段，例如 `div>ul>li*3` 可以快速生成一个包含三个 li 的 ul 列表。 5. **管理代码片段** - 对于团队协作，可以将代码片段存储在版本控制系统...
这个"utools的按键监听代码片段.zip"文件显然包含了用于utools平台的一个插件，该插件专注于监听并响应用户的回车键事件。下面我们将深入探讨这个主题。 在编程中，监听键盘事件是常见的交互设计，特别是在桌面应用...
有了这么一个管理器，平时可以将自己辛苦写出来的代码片段或算法记录下来。实际上这只是个支持语法着色的简单代码编辑器，带了一点文件管理功能。 更新日志在http://blog.sina.com.cn/s/blog_6204ca300100lh20.html...
在这个“情人节html代码大全&多个代码示例.zip”压缩包中，我们可以期待找到一系列与情人节主题相关的HTML代码片段和示例，这些代码可以用于创建浪漫且吸引人的网页设计。HTML在网页制作中扮演着核心角色，它允许...
"6、运用代码.jpg"可能是展示了一些实际的HTML代码片段，这些代码可以被复制粘贴到日志的HTML编辑模式中，以实现特定的边框效果。HTML边框可以通过CSS（层叠样式表）来定义，例如使用`border`属性，或者通过插入图像...
【星际争霸 web游戏设计 html代码片段】是一款基于HTML5技术构建的在线小游戏，它将经典的星际争霸主题融入到网页环境中，让玩家可以在浏览器上体验到星际争霸的乐趣。本项目主要运用了HTML、CSS3和JavaScript等前端...
这通常通过监听代码编辑区域的输入事件，然后将新的HTML代码片段插入到预览区域来实现。 JavaScript是实现这一功能的核心技术，它提供了DOM（Document Object Model）操作接口，允许我们动态地创建、修改和删除HTML...
以上就是7个重要的 jQuery 代码片段，涵盖了打印页面、输入框提示、全选/取消全选复选框、禁用右键点击、淡入淡出效果、回到顶部功能以及 AJAX 表单提交等常见任务的解决方案。学习并掌握这些代码片段，将有助于提升...
标题中的“6年来自己最常用的asp+html代码”意味着这个压缩包包含了作者在长达六年的实践中经常使用的ASP（Active Server Pages）和HTML代码片段。这些代码可能是解决常见问题的模板，或者是作者根据项目需求定制的...
这个特定的VS Code扩展——xabikos-vscode-react，是专门为React开发设计的，提供了许多方便的代码片段，帮助开发者快速编写React组件和其他相关代码。 首先，让我们深入了解React.js。React使用组件化思想，允许...