html

常用的标题等标签就不记录了,只记录一下比较少见的标签以及属性

表格 table

  • td 单元格
  • tr 表的行
  • th 表头

td或th可以下面的两个属性达到跨行或跨列

  • 表格跨行 rowspan
  • 表格跨列 colspan

例子:

<!--cellspacing 单元格间距 cellpadding单元格边距  -->
<table border="1" cellspacing="0" cellpadding="0">
<tr><th colspan="2">Header</th></tr>
<tr><td>Data</td><td>Data</td></tr>
</table>

效果:

Header
Data Data

跑马灯 marquee标签

marquee标签 跑马灯效果

  • scrolldelay 移动速度
  • direction 移动方向 有上下左右 up down left right
  • behavior 滚动方式 scroll:循环滚动,默认效果; slide:只滚动一次就停止; alternate:来回交替进行滚动
  • scrollamount 移动速度 每次移动的距离像素
  • scrolldelay 滚动延迟 设置滚动的时间间隔,单位是毫秒

代码:

<marquee>
<p>hello world!this is marquee!</p>
</marquee>

效果:

hello world!this is marquee!

marquee参考链接

表单 form

代码:

<!-- 文字和输入框居中对齐 -->
<label fro="username">用户名<input id="username" type="text">

效果:

用户名:

表单元素:

  • input 单行输入框,根据不同的 type 属性,可以变化为多种形态

    不同type的样式参考链接
  • select 下拉选择
  • textarea 多行输入框
  • button 按钮

常用属性:

  • required 该标签内容必须填写
  • minlength 输入最短长度
  • maxlength 输入最长长度
  • readonly 只读,无法点击,可以复制
  • disable 禁用,背景色变灰色,无法点击,无法复制

使用了minlengthmaxlength鼠标悬浮在输入框上面会出现提示

这个最小长度为4,最大长度为6

这个是邮箱输入框

  • get: 明文显示,书签收藏,提交数据量有限制
  • post: 密文显示,文件上传需求
如果要做文件上传表单数据的编码方式必须是:multipart/form-data
<form method="post" enctype="multipart/form-data">;
//例如:
<form action="servlet/upload" method="post" enctype="multipart/form-data">
<br><br>
文件(file): <input type="file" name="upload">
<br>
<br>
<button type="submit">上传</button> <br><br>
ajax:异步请求
</form>

html表单参考链接

框架 frameset

frameset属性:

  • rows 分为几行
  • rows="20%,80%" rows="20%,*"
  • cols 分为几列

frame属性:

  • scrolling 滚动条是否显示 no,1(yes)
  • src 对应的html页面定义

frame设置name.a标签指定target为该frame的name,就会在该处frame打开新页面

Web前端——Html常用标签及属性的更多相关文章

  1. web前端开发常用的10个高端CSS UI开源框架

    web前端开发常用的10个高端CSS UI开源框架   随着人们对体验的极致追求,web页面设计也面临着新的挑战,不仅需要更人性化的设计理念,还需要设计出更酷炫的页面.作为web前端开发人员,运用开源 ...

  2. web前端学习笔记:文本属性

    今天的web前端笔记主要讲述文本属性,希望能帮助到正在学习web前端开发的初学者们,废话不多说了,一起来看看文本属性的相关内容吧. 文本属性 文本缩进 将Web页面上的一个段落第一行缩进,这是一种最常 ...

  3. web前端开发常用组件

    web前端开发常用组件 1. 对话框(dialog):jbox(适合对话框等其它功能).colorbox(也很强大,可以弥补jbox图片轮播的落点),      这二者基本能搞定所有对话框的情况 2. ...

  4. web前端之 HTML标签详细介绍

    html标签的分类 点我查看完整的html标签介绍 在html中,标签一般分为块级标签和行内标签 块级标签:块元素一般都从新行开始,它可以容纳内联元素和其他块元素,常见块元素是段落标签"p& ...

  5. html常用标签及属性,常用英语单词

    目录 html常用标签 html常用标签属性 前端常用英语单词表(未完待续) 欢迎评论点赞交流,转发请添加原博客连接谢谢! Ctrl键+F 可以查找你想要的内容哦! html常用标签 htmi结构 & ...

  6. 前端之常用标签和CSS初识

    外层div的宽度是100%,就是视口的大小,当视口被拉窄到小于内层div的宽度980px时,比如800px,此时 外层div宽度为800px,内层div宽度依然为980px,而css中只设置了外层di ...

  7. HTML初学者常用标签及属性

    1.HTML5头部结构   [DOCTYPE html] 声明文档类型为HTML5文件. 文档声明在HTML5文档必不可少,且必须放在文档的第一行.   [meta标签] 1-charset属性:单独 ...

  8. HTML之常用标签及属性

    标签 标签分类 标签名 英文 英文含义 标签类型 备注 HTML页面结构 < html> HyperText Markup Language 超文本标记语言 < head> h ...

  9. HTML常用标签及属性

    标签格式 格式: 双边:<标签名 属性1="值1" 属性2='值2' 属性3=值3>内容</标签名> 单边:<标签名 属性1="值1&quo ...

随机推荐

  1. [译]Vulkan教程(27)Image

    [译]Vulkan教程(27)Image Images Introduction 入门 The geometry has been colored using per-vertex colors so ...

  2. IT兄弟连 HTML5教程 设置IE9以下版本浏览器支持HTML5

    HTML2.HTML5刚发布时由于各浏览器之间的标准不统一,开发者的时间都浪费在解决Web浏览器之间的兼容性上.但由于W3C和WHATWG对HTML5新版本的制定,以及近年来对HTML5的使用,再加上 ...

  3. MySQL插入数据时报错Cause: java.sql.SQLException: #HY000的解决方法

    数据库中有字段要求不能为空,但是insert插入的时候,改字段没有值

  4. Django入门必知必会操作

    一.Django基础必备三件套 HttpRseponse 内部传入一个字符串参数,返回给浏览器. 在app目录下的views.py添加函数,添加函数之前必须在urls.py添加函数对应关系,否则访问不 ...

  5. (转)Polynomial interpolation 多项式插值

    原文链接:https://blog.csdn.net/a19990412/article/details/87262531   扩展学习:https://www.sciencedirect.com/t ...

  6. Python的6种内建序列之通用操作

    数据结构式通过某种方式(例如对元素进行编号)组织在一起的数据元素的集合,这些数据元素可以是数字或者字符,甚至可以是其他数据结构.在Python中,最基本的数据结构是序列(sequence).序列中的每 ...

  7. 输出所有java进程的gc状态

    #!/bin/sh #read -t -p "请输入jstat命令监控间隔,次数:" time count read -p "输入jstat命令监控间隔(1s输出一次,输 ...

  8. Vue.js+vue-element搭建属于自己的后台管理模板:创建一个项目(四)

    Vue.js+vue-element搭建属于自己的后台管理模板:创建一个项目(四) 前言 本章主要讲解通过Vue CLI 脚手架构建工具创建一个项目,在学习Vue CLI之前我们需要先了解下webpa ...

  9. flutter 下拉加载+下拉加载

    功能: 1.下拉加载 2.上拉加载 3.显示加载图标 4.更新列表数据,隐藏加载图标 flutter库: flutter_spinkit: ^3.1.0 加载图标 其他:加载列表需要列表,基于上一节的 ...

  10. linux基本命令的操作

    ---恢复内容开始--- ----------------------------=========================文件与目录操作cd /home 进入’/homw’目录cd … 返回 ...