• Web前端——Html常用标签及属性


    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
    DataData

    跑马灯 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打开新页面

  • 相关阅读:
    Windows 下Nexus搭建Maven私服
    WebService中获取request对象一例
    利用window.navigator.userAgent判断当前是否微信内置浏览器
    批量插入写法
    MySql 使用递归函数时遇到的级联删除问题
    【Mysql】 你会用 information_schema吗?
    Volatile 多线程中用到的关键字
    spring+springMVC中使用@Transcational方式管理事务的必须要配的东西。
    Android中操作SQLite数据库
    Oracle中的字符处理方法
  • 原文地址:https://www.cnblogs.com/stars-one/p/11067724.html
Copyright © 2020-2023  润新知