学习前端 第一天之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>,也 ...
随机推荐
- linux下如何交叉编译util-linux?
1. 获取源码 wget https://mirrors.edge.kernel.org/pub/linux/utils/util-linux/v2.34/util-linux-2.34.tar.xz ...
- 《Flutter 实战》开源电子书
<Flutter 实战>开源电子书 转 https://blog.csdn.net/OQjya206rsQ71/article/details/86619630 关于 Flutter ...
- Swift 循环
循环类型 Swift 语言提供了以下几种循环类型.点击链接查看每个类型的详细描述: 循环类型 描述 for-in 遍历一个集合里面的所有元素,例如由数字表示的区间.数组中的元素.字符串中的字符. fo ...
- 在Win7下玩PC游戏发生类似d3d9x_43.dll找不到的情况
由于d3d9x属于DirectX9.0c扩展,默认不会随系统安装.因此要快速修复这个问题可以去微软官网下载D3D驱动补丁. http://www.microsoft.com/zh-cn/downloa ...
- ajax结合mysql数据库和smarty实现局部数据状态的刷新
效果状态:通过点击锁定状态实现状态锁定与不锁定之间的切换 1.主程序:01.php导入smarty和mysql类,取得数据导入列表模板 <?php include './include/M ...
- 常见的RSA套路脚本
工具 rsatool https://github.com/ius/rsatool factordb(分解大素数) http://www.factordb.com python-PyCrypto库 O ...
- 阶段5 3.微服务项目【学成在线】_day03 CMS页面管理开发_13-删除页面-前端-Api调用
增加删除链接 <el-button size="small" type="text" @click="del(page.row.pageId)& ...
- shell编程(2)
一.变量简介 变量是任何一种编程语言都必不可少的组成部分,变量用来存放各种数据.脚本语言在定义变量时通常不需要指明类型,直接赋值即可,shell变量也遵循这个规则. 在Bash shell 中,每一个 ...
- centos 7 gitlab安装服务器
详情见 https://blog.csdn.net/duyusean/article/details/80011540
- Kuhn-Munkras算法解决二分图最优权值匹配
在看这篇博文之前建议看一下上一篇匈牙利法解决二分图最大匹配问题: https://www.cnblogs.com/fangxiaoqi/p/10808729.html 这篇博文参考自:https:// ...