学习前端 第一天之html标签补充
一、常用浏览器内核
Trident(IE内核)
Gecko(firefox)
webkit(Safari)
Chromium/Blink(chrome)
Blink(Opera)
二、常见标签回顾
a标签 属性 target:_blank _self
image
h1 - h5
p 段落标签
br 换行标签
hr 水平线标签
base
form
input
div
ul>li 无序列表
ol>li 有序列表
dl>dt>dd 自定义列表 dd是用来对dt进一步说明的
表格标签
用来处理数据
table>tr>thead>th>tbody>td
表格属性
border 设置属性的边框
cellspacing 设置单元格与单元格之间的空白间距
cellpadding 控制单元格内容和边框的距离
width 设置表格的宽
height 设置表格的高
aligh 设置表格在网页中的水平对齐方式 left center right
表格标题
caption
th表头标签
thead tbody 表格结构
合并单元格
rowspan 垮行合并
colspan 跨列合并
表单:
表单由三部分组成
表单域 提示文本 表单控件 input表单控件 是个单标签 <input /> 可以通过type属性来变化形状
属性:属性值 描述
type = text 单行文本框
password 密码框
radio 单选按钮
checkbox 复选框
button 普通按钮
submit 提交按钮
reset 重置按钮
image 图像形式的提交按钮
file 文本域
name = 由用户自定义 控件的名称
value = 由用户自定义 input 空间中默认的文本值
size = 正整数 input控件在页面中显示的宽度
checked = checked 定义选择控件默认被选中的项
maxlength = 正整数 控件允许输入的最多字符数 默认选中
checked="checked" label标签
1.配合input使用直接包裹
2.如果label里面有多个表单,想定位用for="id" 属性 textarea文本域
select>option 下拉菜单 表单域
1.文本域 textarea 留言的
2.文件域 input type='file' 上传文件的
input新增属性
新增的input属性
邮箱:<input type="email"> <br>
手机:<input type="tel"> <br>
数字:<input type="number"> <br>
网址:<input type="url">
搜索:<input type="seach">
区域:<input type="range"> <!-- 滑块 -->
时间:<input type="time"> <br> <!-- 小时分钟 -->
年月日:<input type="date"> <br>
月份:<input type="month"> <br>
周:<input type="week"> <br>
颜色:<input type="color"> <br>
常用新属性
placeholder 占位符
autofocus 自动获取焦点
multple 多文件上传
autocomplete 自动记录输入过的 on或者off也能控制开关
1. autocomplete 首先需要按钮
2. 必须要有一个name值
required 内容必选项
accesskey 快速定位光标 多媒体标签
embed: 标签定义嵌入的内容
audio: 播放音频
video:
controls 和autoplay 来控制
学习前端 第一天之html标签补充的更多相关文章
- html5学习之第一步:认识标签,了解布局
图1. Acme United的网页的规划 Header区的例子包含了页面标题和副标题,< header>标签被用来创建页面的Header区的内容.除了网页本身之外,< header ...
- 小白学习前端---第一天 了解HTML
一.HTML的结构 1.1 html文档主要包含两个部分:头区域和实体区域. 1.2 html的三个主要标签:<html>.<head>.<body>.<ht ...
- 学习前端第一天心得体会(初步了解HTML5的新特性以及和HTML的区别)
一.HTML5是什么? HTML5 是最新的 HTML 标准. HTML5 是专门为承载丰富的 web 内容而设计的,并且无需额外插件. HTML5 拥有新的语义.图形以及多媒体元素. HTML5 提 ...
- Web基础学习---HTML 第一天
Web基础学习---HTML 第一天 1 HTML标签 2.CSS Web开发基础HTML好吧离开Python几天...如何学好前端?? 多去看别人的网站.多看.多写.多练,(知乎.36Kr.)多练就 ...
- 前端学习 linux —— 第一篇
前端学习 linux - 第一篇 本文主要介绍"linux 发行版本"."cpu 架构"."Linux 目录结构"."vi 和 v ...
- web@前端--html,css,javascript简介、第一个页面(常用标签简介)
1.什么是标签#1.在HTML中规定标签使用英文的的尖括号即`<`和`>`包起来,如`<html>`.`<head>`.`<body>`都是标签,#2. ...
- 李洪强和你一起学习前端之(5)css书写位置 优先级和伪类
亲爱的,时间过得真快,不知不觉我们一起学习前端已经4天了,这4天的时间里,我们是不是收获很大呢,每当我们学习一个新的知识点的时候,每当我们做出一个新的东西来的时候,我们是不是欣喜若狂,世界从来否不会辜 ...
- 高效开发之SASS篇 灵异留白事件——图片下方无故留白 你会用::before、::after吗 link 与 @import之对比 学习前端前必知的——HTTP协议详解 深入了解——CSS3新增属性 菜鸟进阶——grunt $(#form :input)与$(#form input)的区别
高效开发之SASS篇 作为通往前端大神之路的普通的一只学鸟,最近接触了一样稍微高逼格一点的神器,特与大家分享~ 他是谁? 作为前端开发人员,你肯定对css很熟悉,但是你知道css可以自定义吗?大家 ...
- iOS开发如何学习前端(2)
iOS开发如何学习前端(2) 上一篇成果如下. 实现的效果如下. 实现了一个横放的<ul>,也既iOS中的UITableView. 实现了当鼠标移动到列表中的某一个<li>,也 ...
随机推荐
- Eclipse的断点调试
A:Debug的作用 调试程序 查看程序执行流程 B:如何查看程序执行流程 什么是断点: 就是一个标记,从哪里开始. 如何设置断点: 你想看哪里的程序,你就在那个有效程序的左边双击即可. 在哪里设置断 ...
- [Java复习] JVM
Part1:Java类加载机制:类加载器,类加载机制,双亲委派模型 1. Java 类加载过程? 类加载过程即是指JVM虚拟机把.class文件中类信息加载进内存,并进行解析生成对应的class对象的 ...
- 顺序容器删除元素 vector list deque
#include <iostream>#include <list>#include <algorithm>#include <string> usin ...
- github上有对应官方的各种模型
https://github.com/tensorflow/models/blob/master/research/object_detection/g3doc/detection_model_zoo ...
- css简单学习属性2---背景图片
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- sparkStream---1
1.本地scala版 import org.apache.spark._ import org.apache.spark.streaming._ import org.apache.spark.str ...
- Java8中List的removeif()函数的使用示例
代码: import java.util.List; import java.util.function.Predicate; import org.springframework.beans.fac ...
- js匿名函数确实是个好东西
<body onload="alert('http://www.baidu.com/');"> <script type="text/javascrip ...
- vscode使用Chrome浏览器调试不好用,解决方法!!
1.如果你是刚下载vscode,那么你需要下载两个插件. 1. open in browser(在浏览器中查看,支持五大主流浏览器),下载并启用. 2. view-in-browser (在浏览器中查 ...
- [BAT] cmd 管理员权限 右键菜单 运行
将下面保存为 *.reg Windows Registry Editor Version 5.00 [HKEY_CLASSES_ROOT\Directory\Background\shell\runa ...