代码实例：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>信息提交</title>
<style>
p{
font-size:15px;
}
#m{
color:blue;
}
#f{
color:red;
}
.button{
background-color:#e1d8d8;
color:red;
}
</style>
</head>

<body onload="alert('页面已成功加载')">
<div style="text-align:center">
<form action="#" onsubmit="alert('姓名：'+name.value+'\r\n电话：'+tel.value+'\r\n性别：'+sex.value)">
<p>姓名</p>
<input type="text" name="name">
<br><br>
<p>电话</p>
<input type="text" name="tel">
<br><br>
<input type="radio" name="sex" value="男">
<span id="m">男</span>
<input type="radio" name="sex" value="女">
<span id="f">女</span>
<br><br>
<input class="button" type="submit" name="提交">
<input class="button" type="reset" name="重置">
</form>
</div>
</body>
</html>

运行截图：

Css实例之信息提交的更多相关文章

  1. ajax+FormData+javascript实现无刷新表单信息提交

    ajax+FormData+javascript实现无刷新表单信息提交 原理: dom收集表单信息,利用FormData快速收集表单信息  ,实例化表单数据对象 同时收集fm的表单域信息. var f ...

  2. CSS：CSS 实例

    ylbtech-CSS:CSS 实例 1.返回顶部 1. CSS 实例 CSS背景 设置页面的背景颜色 设置不同元素的背景颜色 设置一个图像作为页面的背景 错误的背景图片 如何在水平方向重复背景图像 ...

  3. `＜jsp:getProperty＞`动作和`＜jsp:setProperty＞`动作的使用在一个静态页面填写图书的基本信息，页面信息提交给其他页面，并且在其页面显示。要去将表单元素的值赋值给Java

    <jsp:getProperty>动作和<jsp:setProperty>动作的使用 1.<jsp:getProperty>动作 语法格式: <jsp:get ...

  4. CSS实例

    CSS 实例 CSS背景 设置页面的背景颜色 设置不同元素的背景颜色 设置一个图像作为页面的背景 错误的的背景图片 如何在水平方向重复背景图像 如何定位背景图像 一个固定的背景图片(这个图片不会随页面 ...

  5. LESS CSS 实例

    值得参考的 10 个 LESS CSS 实例   2 收藏(185) LESS, Sass 和其他 CSS 预处理器是一种超棒的方法用来扩展 CSS 功能,使之更适合程序员.你可以使用变量.函数.混合 ...

  6. JS/CSS 各种操作信息提示效果

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  7. CSS实例 display display 边距

    CSS学习大纲 在标签上设置style属性: background-color:#2459a2 ; height:48px ; 编写CSS样式: 1.标签的style属性 2.写在head里面,sty ...

  8. CSS实例练习

    蓝色导航为图片,用background-image实现. 排版用到ul,li标签,下划线运用border-bottom中的dashed,右边文字用到CSS浮动float. 实例: 代码: <!D ...

  9. div+css实例教程

    DIV+CSS是WEB设计标准,它是一种网页的布局方法.与传统中通过表格(table)布局定位的方式不同,它可以实现网页页面内容与表现相分离. 对于初学者来说,可能比较模糊不熟悉.毕竟,样式布局需要通 ...

随机推荐

  1. 付费漫画下载、付费韩漫下载、漫画VIP下载、VIP韩漫下载哪里下

    需要的 来qq:6686496 最近迷上了韩漫(你懂的),主要为了打发时间上班摸鱼,,找了好多网站都是要收费的,就想着试着用爬虫做一个破解. 最简单的第一步,通过url分析出漫画ID.(直接看url就 ...

  2. dll反编译（修改引用文件、修改代码）再生成dll

    问题描述 我们在日常开发中经常会遇到,想要对dll文件做修改的操作,但苦于没有源代码,只能想想其他办法 解决问题 办法就是通过几个工具来反编译.正向编译.修改属性 反编译.正编译 参考https:// ...

  3. React-简单通用的抛物线动画

    一个简单通用的 React 抛物线动画demo Usage import { parabola } from "./parabola" ... onAnimate = () =&g ...

  4. 摩拜单车微信小程序开发技术总结

    前言 摩拜单车小程序已于微信小程序上线第一天正式发布,刷爆微博媒体朋友圈.本文主要讲讲技术方向的总结,在段时间的开发周期内内如何一步步从学习到进阶. 思维转变 微信小程序没有HTML的常用标签,而是类 ...

  5. 【论文简读】 Deep web data extraction based on visual

    <Deep web data extraction based on visual information processing>作者 J Liu 上海海事大学 2017 AIHC会议登载 ...

  6. java-GUI编程之AWT组件

    AWT中常用组件 基本组件 组件名 功能 Button Button Canvas 用于绘图的画布 Checkbox 复选框组件(也可当做单选框组件使用) CheckboxGroup 用于将多个Che ...

  7. 数组-LeetCode-笔试

    目录 数组理论基础 二分查找 二分法第一种写法 二分法第二种写法 ACM 移除元素 暴力解法 双指针法(快慢指针) ACM 有序数组的平方 暴力排序 双指针法 长度最小的子数组 暴力解法 滑动窗口 相 ...

  8. 帝国CMS实现栏目批量修改：是否生成

    帝国cms实现栏目批量修改 是否生成:不生成栏目页, 不生成内容页, 不生成JS调用, 标签不调用的修改方本文关键字词:栏目批量设置第一步./e/admin/SetMoreClass.php中查找: ...

  9. 深入理解Kafka核心设计及原理（三）：消费者

    转载请注明出处:https://www.cnblogs.com/zjdxr-up/p/16114877.html 深入理解Kafka核心设计及原理(一):初识Kafka 深入理解Kafka核心设计及原 ...

  10. Myeclipse+svn相关文章

    Myeclipse安装svn插件https://www.cnblogs.com/liuyk-code/p/7519886.html 使用svn https://jingyan.baidu.com/ar ...