html、css、js分工,内核,html头,html表单
html:内容
css:样式
js:交互
内核
浏览器控制台输入navigator.userAgent,回车显示出内核"Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36"
1.webkit(Safari、chrome浏览器内核)
2.Trident(IE浏览器内核)
3.Gecko(FireFox浏览器内核)
4.blink(Google之前受Apple限制,自己新出的内核)
4.Presto(Opera浏览器内核,后又站队到Google)
html头
1.html头<!DOCTYPE html>表示文档类型是html,不加这句话在IE6下会有兼容性问题。
2.<meta charset="utf-8">meta表示源,charset表示字符集,不设置utf-8默认是GB2312简体中文,在mac系统中不识别,打开是乱码。
<meta name="viewport" content="width=device-width, initial-scale=1">viewport表示可视窗口,content="width=device-width"表示可视窗口宽度等于设备宽度。initial-scale=1表示初始缩放是一倍。user-scalable=no表示不允许用户用手缩放。
<meta name="keywords" content="小米手机、三星手机">这些设置我们看不见,是给搜索引擎看的,一些爬虫根据keywords、content查找。
<meta name="description" content="1234567890balabala">这是介绍,也有助于搜索引擎优化。这些都是给浏览器看的。
body
<img>标签 alt表示没有图片是显示的替换文字,title表示鼠标在图片上是给出的提示信息。
<table border="1" cellspacing="0">
<tr>
<td>11</td>
<td colspan="2">22</td>
</tr>
<tr>
<td rowspan="2">44</td>
<td>55</td>
<td>66</td>
</tr>
<tr>
<td>88</td>
<td>99<td>
</tr>
</table>
表单
<form action="">
<label for="username">用户名</label>
<input type="text" id="username">
<label for="pwd"></label>密码:</label>
<input type="password" id="pwd">
</form>
加上<label>标签,for和id的值一样,会将用户名与输入框变成一个整体,点击用户名,输入框就可以聚焦。
性别:
<input type="radio" name="sex">男
<input type="radio" name="sex" checked>女
单选按钮必须加上name属性,说明不同的单选按钮是一组的,否则所有单选按钮都可以选择上。checked默认被选中.
复选框
爱好:
<input type="checkbox">唱歌
<input type="checkbox" checked>跳舞 checked默认被选中
下拉框
省:<select name="province" id="">
<option value="">黑龙江</option>
<option value="">吉林</option>
<option value="" selected>辽宁</option>
</select>
selected默认被选中,数据传给后台的时候,传的值是value,不是显示的汉字。
多级下拉框
省:<select name="province" id="">
<optgroup value="" label="黑龙江">
<option>哈尔滨</option>
<option>鹤岗</option>
</optgroup>
<optgroup value="" label="吉林">
<option>吉林</option>
<option>长春</option>
</optgroup>
<optgroup value="" label="辽宁" >
<option>沈阳</option>
<option>大连</option>
</optgroup>
</select>
文本域 <textarea></textarea>
邮箱:<input type="email">
个人网站:<input type="url">
<input type="submit">
点击提交按钮,会提示你输入正确的格式
生日:<input type="date">浏览器自带日历
input框的type类型number、search在移动端会根据不同的type弹出不同的键盘更适合做不同的事儿。
html、css、js分工,内核,html头,html表单的更多相关文章
- js控制select选中显示不同表单内容
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- WTF Forms – 使用 CSS 实现用户体验更好的表单
WTF forms 借助 CSS 提供友好的 HTML 表单控件,专为 IE9+ 以及最新的 Chrome.Safari 和 Firefox 浏览器.以文件输入控件的改进,使用 label 包裹在 i ...
- 精通CSS+DIV网页样式与布局--设置表单和表格
表格和表单是网页中非常重要的两个元素,在上篇博客中,我们简单的介绍了CSS的页面背景设置,今天小编继续来介绍CSS的相关知识,在我们的CSS中如何设置表格和表单,首先,来看一张思维导图,通过图简单的预 ...
- 如何搞定IE+google双内核的360浏览器表单自动回填兼容问题
最近开发中碰到一个关于表单问题,在用户提交表单时候浏览器会提示是否保存帐号 如果点击保存,在退出帐号切换其他帐号时,浏览器会自动为表单填充数据,为了解决这个自动填充问题时, 主要分2个思路来解决,一个 ...
- bootstrapValidator.js,最好用的bootstrap表单验证插件
前言:做Web开发的我们,表单验证是再常见不过的需求了.友好的错误提示能增加用户体验.博主搜索bootstrap表单验证,搜到的结果大部分都是文中的主题:bootstrapvalidator.今天就来 ...
- Vue.js 学习笔记 第6章 表单与v-model
本篇目录: 6.1 基本用法 6.2 绑定值 6.3 修饰符 表单类控件承载了一个网页数据的录入与交互,本章将介绍如何使用指令v-model完成表单的数据双向绑定. 6.1 基本用法 表单控件在实际业 ...
- bootstrapValidator.js,最好用的bootstrap表单验证插件 简单实用方法
实用方法 1.引入 在有jquery和bootstrap的页面里引入bootstrapValidator.js和bootstrapValidator.css文件 2. 按照bootstrap的表单组件 ...
- js中对arry数组的各种操作小结 瀑布流AJAX无刷新加载数据列表--当页面滚动到Id时再继续加载数据 web前端url传递值 js加密解密 HTML中让表单input等文本框为只读不可编辑的方法 js监听用户的键盘敲击事件,兼容各大主流浏览器 HTML特殊字符
js中对arry数组的各种操作小结 最近工作比较轻松,于是就花时间从头到尾的对js进行了详细的学习和复习,在看书的过程中,发现自己平时在做项目的过程中有很多地方想得不过全面,写的不够合理,所以说啊 ...
- SharePoint js操作原生的New/Edit表单
列表的表单,有个类似的需求:在New需隐藏特定字段,Edit时显示. 默认是New/Edit表单的字段是一样,就算在Content type 是隐藏也是同时影响两个表单. 如何做到仅仅在New时隐 ...
- js 上传文件模拟Form 表单
使用FormData对象 在本文章中 创建一个FormData对象 使用HTML表单来初始化一个FormData对象 使用FormData对象发送文件 利用FormData对象,你可以使用一系列的键值 ...
随机推荐
- ssm项目的创建思路
·DAO层: 代码:pojo.映射文件.接口文件——Mybatis逆向工程自动生成 配置:ApplicationContext-dao.xml——数据源.连接池.会话工厂.mapper包扫描 ·Ser ...
- vue-router路由详细
由于Vue在开发时对路由支持的不足,于是官方补充了vue-router插件.vue的单页面应用是基于路由和组件的,路由用于设定访问路径,并将路径和组件映射起来.传统的页面应用,是用一些超链接来实现 ...
- html—倒计时demo
<!doctype html> <html> <head> <meta charset="utf-8"> </head> ...
- [Web 前端] 001 html 常用块级标签
目录 1. html "总体框架" 2. 常用的 HTML 块级标签(块元素) 2.1 知识点 2.2 以下 code 均写在 body 体中 2.2.1 标题标签,只有 h1-h ...
- 基本数据类型间的运算(不包括boolean)
一 基本数据类型的间的运算 (不包括boolean) 1.自动类型提升 : 小容量的变量和大容量的变量做运算结果用大容量的变量的类型来接收. byte , short , char -> in ...
- 打开虚拟机提示 无法获得vmci 驱动程序的版本:句柄无效
我从另一台电脑复制过来虚拟机,提示如题. 找到 我的虚拟机的 *.vmx文件(如NeoKylin.vmx),其中有 vmci0.present = "TRUE",将TRUE改为 ...
- Codeforces 1159F Winding polygonal line(叉积)
其实这个几何写起来还是比较方便,只用到了叉积.首先我们贪心的考虑一种情况,对于任意给定的LR串,我们起点的选择肯定是在这些点围成的凸包端点上,对于这样的起点来说,他对于L或者R都是有选择的机会,而且一 ...
- body传参?parameter传参?Request Payload?Query String Parameter?
今天,是有委屈的一天:今天,是有小情绪的一天.所以,我们要对今天进行小结,跟它做一个了断! 今天,后端来一个接口,告诉我"要用post请求,parameter形式传参".over. ...
- spark浅谈(3):
一.shuffle操作 1.spark中特定的操作会触发我们都知道的shuffle事件,shuffle是spark进行数据重新分布的机制,这通常涉及跨执行程序和机器来赋值数据,使得混洗称为复杂而且昂贵 ...
- JavaScript深入之从原型到原型链(转载)
构造函数创建对象 我们先使用构造函数创建一个对象: function Person() { } var person = new Person(); person.name = 'Kevin'; co ...