前端1-----块级标签(独占一行),排版标签(样式排版),其他标签,form表单(input的多种类型)
前端1-----块级标签(独占一行),排版标签(样式排版),其他标签,form表单(input的多种类型)
一丶HTML块级标签
排版标签
p 标签: 段落标签,会自动在段落上下加上空白来分开
p标签是一个文本标签,本身是一个块级标签不能再嵌套块标签
div 标签: 没有样式的标签 ,最常用
列表
1.无序列表 常用
2.有序列表
3.标题列表
# 无序列表 circle:空心圆, disc:默认实心圆,square:实心方片
<ul type='circle'>
<li>1</li>
<li>2</li>
</ul>
<ul type='square'>
<li>1</li>
<li>2</li>
</ul>
<ul>
<li>1</li>
<li>2</li>
</ul>
# 有序列表 ol ,type:阿拉伯数字和英文字母. start :从第几个开始
<ol type='1' start='2'>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ol>
# 标题列表
<dl>
<dt>标题</dt> <!-- dt 表示标题 -->
<dd>1</dd> <!-- dd 内容 -->
<dd>2</dd>
<dd>3</dd>
</dl>
表格
table 表格:
thead :表头
tr: 一行
th: 一列 , 加粗的单元格。相当于<td> + <b>
<caption>:表格的标题。使用时和tr标签并列
tbody: 表身
tr:一行
td:一列
表格属性:
width : 宽度
height: 高度
bordercolor: 边框颜色
border : 边框
align :表格的水平对齐方式
bgcolor : 背景颜色
background : 背景图片
cellspacing :单元格和单元格之间的距离(外边距),像素为单位。默认情况下的值为0
cellpadding :单元格内容到边的距离,像素为单位。默认情况下,文字是紧挨着左边那条线的,即默认情况下的值为0。注意:注意不是单元格内容到四条边的距离哈,而是到一条边的距离,默认是与左边那条线的距离。如果设置属性dir="rtl",那就指的是内容到右边那条线的距离。
合并单元格:
colspan:横向合并。例如colspan="2"表示当前单元格在水平方向上要占据两个单元格的位置。
rowspan:纵向合并。例如rowspan="2"表示当前单元格在垂直方向上
tr属性:
dir:公有属性,设置这一行单元格内容的排列方式。可以取值:ltr:从左到右(left to right,默认),rtl:从右到左(right to left)
bgcolor:设置这一行的单元格的背景色。
height:一行的高度
align="center":一行的内容水平居中显示,取值:left、center、right
valign="center":一行的内容垂直居中,取值:top、middle、bottom
td属性:
align:内容的横向对齐方式。属性值可以填:left right center。
valign:内容的纵向对齐方式。属性值可以填:top middle bottom
width:绝对值或者相对值(%)
height:单元格的高度
bgcolor:设置这个单元格的背景色。
background:设置这个单元格的背景图片。
具体代码如下:
前端1-----块级标签(独占一行),排版标签(样式排版),其他标签,form表单(input的多种类型)的更多相关文章
- select标签 禁止选择但又能通过序列化form表单传值到后台
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁止选择但又能通过序列化form表单传值到后台,但是当我们使用disabled="disabled"时发现,无法序列化 ...
- 前端开发-4-HTML-table&form&表单控制 标签
1.table标签 <!DOCTYPE html> <html lang="cn"> <head> <meta charset=" ...
- [oldboy-django][2深入django]学生管理(Form)-- 添加(美化Form表单:通过form给前端标签添加属性)
1 在student_list添加一个a标签, <p><a href="/app01/add_student" class="btn btn-prima ...
- Unit 2.前端之html--table(表格),form(表单)标签
一.table标签 作用:定义html表格.一个table标签元素至少包含 thead(表头),tbody(表主题),还可以有tfoot(表底部) html表格游table元素及一个或者多个tr,th ...
- 关于form表单排版的技巧
//此处说明一个对于排版表单的方法将form表单嵌套在table里,因为table是格式化的,所以就不用再手动排版了源码如下 <from action="" method=& ...
- [原创]java WEB学习笔记62:Struts2学习之路--表单标签:form,表单标签的属性,textfield, password, hidden,submit ,textarea ,checkbox ,list, listKey 和 listValue 属性,select ,optiongroup ,checkboxlist
本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱 ...
- 基于JQuery的前端form表单操作
Jquery的前端表单操作: jquery提供了良好的方法封装,在一些基本的操作的时候,能节省很多的麻烦,其中,在具体使用时,form表单的数据提交是最频繁也最常见的前后数据交换方式,所以在前 ...
- 【HTML】--- 列表、表格、form表单标签
Html常用标签(2) 上篇博客讲了些常用的html标签 :[HTML]---常用标签(1) 这里主要讲 列表.表格标签和 form表单标签. 一.列表.表格标签 1.列表标签 概念 把内容以列表的形 ...
- 前端form表单与css
form表单(******) 能够获取用户输入(输入,选择,上传的文件) 并且将用户输入的内容全部发送给后端 参数 action 控制数据提交的地址 三种书写方式 1.不写 默认就是朝当前这个页面所在 ...
随机推荐
- 06-cmake语法-include
用来载入CMakeLists.txt文件,也用于载入预定义的cmake模块. include(cmake/OpenCVMinDepVersions.cmake) .cmake 是一个文本,定义了一个模 ...
- Educational Codeforces Round 78 (Rated for Div. 2) B. A and B
链接: https://codeforces.com/contest/1278/problem/B 题意: You are given two integers a and b. You can pe ...
- 【oracle】update 某字段为null
字段 = null 注意这个字段要可以为空
- 【oracle】根据日、月、年分组
--根据日期分组--------------------------------------------------- SELECT to_char(to_date(XXXX, 'yyyymmdd') ...
- Taro-UI 2.0样式在H5上生效,微信小程序不生效?
答案: https://taro-ui.aotu.io/#/docs/questions taro-ui 自定义样式覆盖小程序组件样式使用到了 globalClass 这个微信小程序特性,由于微信小程 ...
- eclipse scala语法用java检验 报错问题
传送门 https://stackoverflow.com/questions/8522149/eclipse-not-recognizing-scala-code 还是 直接用eclipse的 sc ...
- 前端,DJ
Vue模块 1.Vue都有哪些指令,简单说说? """ Vue里面常见指令有文本指令:v-text.v-html,属性指令:v-bind,方法指令:v-on,条件指令:v ...
- bzoj2839 集合计数 组合计数 容斥原理|题解
集合计数 题目描述 一个有N个元素的集合有2^N个不同子集(包含空集),现在要在这2^N个集合中取出若干集合(至少一个),使得它们的交集的元素个数为K,求取法的方案数,答案模1000000007.(是 ...
- 搭建Hadoop+Python的大数据开发环境
实验环境 CentOS镜像为CentOS-7-x86_64-Everything-1804.iso 虚机配置 节点名称 IP地址 子网掩码 CPU/内存 磁盘 安装方式 master 192.168. ...
- [Gamma]阶段测试报告
后端测试 我们进行了覆盖性测试,覆盖率达到77%. Beta阶段发现的Bug 项目显示的图片错误 无法使用搜索框 发布实验室项目的按钮点击无法跳转 连续点击发帖按钮可能发出多个相同的帖子 不需要点击我 ...