zoukankan      html  css  js  c++  java
  • 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打开新页面

  • 相关阅读:
    python自省函数getattr的用法
    python-mysqldb安装
    weblogic部署脚本
    netcat使用
    ssh批量互信脚本
    yum安装出错
    centos文件误删除恢复
    lamp php的ssl,ssh支持
    ssh免密码登陆
    python 学习笔记 四 条件, 循环以及其他
  • 原文地址:https://www.cnblogs.com/stars-one/p/11067724.html
Copyright © 2011-2022 走看看