学习前端 第一天之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>,也 ...
随机推荐
- Flex 布局教程实例
Flex 布局教程实例 一.Flex 布局是什么? Flex 是 Flexible Box 的缩写,意为"弹性布局",用来为盒状模型提供最大的灵活性. 任何一个容器都可以指定为 F ...
- VBA 格式化excel数据表 (数据分列)
Sub ImportData() ' ' Copy Data from one workbook to the Current Workbook ' Place the macro file in t ...
- Selenium下Chrome配置 (含启动无痕界面)
例子: 设置无界面模式浏览器启动chrome_options = webdriver.ChromeOptions() chrome_options.add_argument('--headless') ...
- logback 和 log4j对比,及相关配置
Logback 一.logback的介绍 Logback是由log4j创始人设计的又一个开源日志组件.logback当前分成三个模块:logback-core,logback- classic和log ...
- 通过举例了解java中的流
Java流结构介绍: Java所有的流类位于java.io包中,都分别继承字以下四种抽象流类型. 字节流 字符流 输入流 InputStream Reader 输出流 OutputStream W ...
- Spring分页实现PageImpl<T>类
Spring框架中PageImpl<T>类的源码如下: /* * Copyright 2008-2013 the original author or authors. * * Lice ...
- CDH集群部署hive建表中文乱码
背景:部署CDH集群的 hive 服务,选用 mysql 作为 hive 元数据的存储数据库,通过 hive cli 建表时发现中文注释均乱码. 现象:hive端建表中文注释乱码. 定位: 已经确认过 ...
- php-fpm 优化
/usr/local/php/etc/php-fpm.conf 优化 [global] pid = /usr/local/php/var/run/php-fpm.pid error_log = /us ...
- Ocelot 配置参数
Downstream是下游服务配置 UpStream是上游服务配置 Aggregates 服务聚合配置 ServiceName, LoadBalancer, UseServiceDiscovery 配 ...
- shell脚本中set -e作用
最近学习shell脚本想到一个问题,如果脚本中出现了一条异常语句,甚至可以影响整个脚本的使用,那么是否有一旦出现问题就可以及时停止的方法呢?在shell脚本中set命令就可以轻松实现.set命令的-e ...