html 后手
1.a
(1.)超链接
<a href="new.html">点击进入到新网页</a>
这里可以直接跳转到一个页面
<a href="http://www.baidu.com" target="_blank">进入百度</a>
这里 target="_blank 指可以在空白页面打开新网址
target="_self 指可以再当前页面显示新网址
(2)标签内部跳转
锚点 默认有点击行为。我们可以javascript:void(0);阻止a标签的默认点击行为。
<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8">
<title>Title</title> </head>
<body>
<p>my</p>
<p>my</p>
<p>my</p>
<p>my</p><p>my</p>
<p>my</p>
<div id="zhangqing">张庆</div>
<p>my</p>
<p>my</p>
<p>my</p>
<p>my</p>
<p>my</p>
<p>my</p>
<p>my</p>
<p>my</p>
<p>my</p><p>my</p>
<p>my</p>
<p>my</p><p>my</p>
<p>my</p>
<p>my</p>
<p>my</p>
<p>my</p>
<p>my</p><p>my</p>
<p>my</p>
<p>my</p><p>my</p>
<p>my</p>
<p>my</p><p>my</p>
<p>my</p>
<p>my</p><p>my</p>
<p>my</p>
<p>my</p><p>my</p>
<p>my</p>
<p>my</p><p>my</p>
<p>my</p>
<p>my</p>
<a href="#zhangqing">找张庆</a>
<a href="#zhangqing">找张庆</a>
<a href="#">找张庆</a>
<a href="#">找张庆</a>
<a href="javascript:void(20)">找张庆1</a>
<a href="javascript:void(0)">找张庆2</a> </body>
</html>
内部跳转
锚点 默认有点击行为。我们可以javascript:void(0);阻止a标签的默认点击行为。
第一个根据 id 查找 第二个 回到顶部 第三个 刷新
2.image
src:连接的图片资源
alt:图片资源加载失败。显示的文本
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
span{
color: blue;
}
a{
display: inline-block;
width: 300px;
height: 300px;
}
</style>
</head>
<body>
<div class="box">
<a href="javascript:void(0);">
<img src="https://img04.sogoucdn.com/app/a/100520093/9243fbcd523532c7-65a10dc900adf004-16cb2e34a14409c94f53ee8772786500.jpg" alt="奥斯卡讲道理" width="500" height="600">
</a>
</div>
<div>
<span>我最强</span>
</div>
</body>
</html>
a与img 设置图片链接
a{
display: inline-block;
width: 300px;
height: 300px;
}
这里是将超链接于图片重合不会卡位置
3.ul ol dl
ul为无序 这里并不是没有序号 而是一个语句 可以嵌套 li
ol 为有序 有自己的type类型
dl为自定义 dt dd
dt 是主要描述的 是特别加粗的
dd是用来描述dt的 可没有
4.table
border='1' style="border-collapse:collapse;" 将单元格的线和表格的单元合并1
table 由 tr td 组成 tr是上面的列 td 是列上的内容 table实现的的是一个竖列
table 可以设置单元格的大小 border 是显示那些单元格的线
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<table border="2" style="align-collapse: collapse;">
<tr> <td>我是</td>
<td>我是</td>
<td rowspan="2">我</td>
</tr>
<tr>
<td>拿着</td>
<td>拿着</td>
</tr>
</table>
</body>
</html>
将上下单元格合并
单元格可以合并成一块 横向(左右)为
<td colspan="2">日天</td> 需要将空缺的是改掉 后面接的是合并的块
单元格可以合并成一块 纵向(上下)为
<td colspan="2">日天</td>
在表格中 有优先级<thead> <tbody> <tfoot> 这三个优先级
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<table border="2" style="align-collapse: collapse;">
<tfoot>
<tr>
<td>21拿着</td>
<td>我拿着</td>
</tr>
</tfoot>
<thead>
<tr> <td>我是</td>
<td>我是</td>
<td rowspan="2">我</td>
</tr>
</thead> <tr>
<td>拿着</td>
<td>拿着</td>
</tr>
</table>
</body>
</html>
table 优先级
5.form
form
HTTP协议
action:提交的服务器网址
method:get(默认)| post(应用:登录注册、上传文件)
页面中的a img link 默认是get请求\
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action="" method="get" enctype="multipart/form-data"> 姓名<input value="哈哈">逗比<br>
昵称<input value="哈哈" readonly="">逗比<br>
名字<input type="text" value="name" ><br>
密码<input type="password" value="pwd" size="50"><br>
性别<input type="radio" name="gender" value="male" checked="">男
<input type="radio" name="gender" value="male" >女<br>
爱好:<input type="checkbox" name="love" value="eat">吃饭
<input type="checkbox" name="love" value="sleep">睡觉
<input type="checkbox" name="love" value="bat">打豆豆
</form> </form> </body>
</html>
input文本
checkbox
:多选按钮,名字相同的按钮作为一组进行选择。checked
:将单选按钮或多选按钮默认处于选中状态。当<input>
标签的type="radio"
时,可以用这个属性。属性值也是checked,可以省略。value="内容"
:文本框里的默认内容(已经被填好了的)size="50"
:表示文本框内可以显示五十个字符。一个英文或一个中文都算一个字符。
注意size属性值的单位不是像素哦。readonly
:文本框只读,不能编辑。因为它的属性值也是readonly,所以属性值可以不写。
用了这个属性之后,在google浏览器中,光标点不进去;在IE浏览器中,光标可以点进去,但是文字不能编辑。disabled
:文本框只读,不能编辑,光标点不进去。属性值可以不写。
6.select 下拉列表清单
<form>
<select>
<option>小学</option>
<option>初中</option>
<option>高中</option>
<option>大学</option>
<option selected="">研究生</option>
</select>
<br><br><br> <select size="3">
<option>小学</option>
<option>初中</option>
<option>高中</option>
<option>大学</option>
<option>研究生</option>
</select>
<br><br><br> <select multiple="">
<option>小学</option>
<option>初中</option>
<option selected="">高中</option>
<option selected="">大学</option>
<option>研究生</option>
</select>
<br><br><br> </form>
下拉列表
<option selected="">研究生</option> 为优先研究生
size 默认为1 为下拉视图 size="3 " 就按照滚动式图
html 后手的更多相关文章
- HDU 3980 (SG 环变成链 之前的先手变成后手)
题意 两个人在一个由 n 个玻璃珠组成的一个圆环上玩涂色游戏,游戏的规则是: 1.每人一轮,每轮选择一个长度为 m 的连续的.没有涂过色的玻璃珠串涂色 2.不能涂色的那个人输掉游戏 Aekdycoin ...
- UNITY 优化之带Animator的Go.SetActive耗时问题,在手机上,这个问题似乎并不存在,因为优化了后手机上运行帧率并未明显提升
UNITY 优化之带Animator的Go.SetActive耗时问题,在手机上,这个问题似乎并不存在,因为优化了后手机上运行帧率并未明显提升 经确认,这个问题在手机上依然存在,不过占的比例非常小.因 ...
- 利物浦VS曼城,罗指导的先手与工程师的后手
本想『标题党』一下的,『高速反击遭遇剧情反转,巴西人力挽狂澜绝处逢生!』这种好像看起来比较厉害的标题似乎在大战之后的第五天已显得不合适了. /不害臊 反正晚了,干脆写点能够引起讨论.并且在未 ...
- hdu5795 A Simple Nim 求nim求法,打表找sg值规律 给定n堆石子,每堆有若干石子,两个人轮流操作,每次操作可以选择任意一堆取走任意个石子(不可以为空) 或者选择一堆,把它分成三堆,每堆不为空。求先手必胜,还是后手必胜。
/** 题目:A Simple Nim 链接:http://acm.hdu.edu.cn/showproblem.php?pid=5795 题意:给定n堆石子,每堆有若干石子,两个人轮流操作,每次操作 ...
- 关于微信小程序更新内容后手机上不能及时显示的办法
这几天一直在做微信小程序的二次开发,每天都要发布程序,但是发布之后微信上查看小程序和以前的一模一样,丝毫没有改变,但是我再本地上却改变了,而且没有开的不校验合法域名那个.这是为啥呢????? 这是跟小 ...
- SCNU ACM 2016新生赛决赛 解题报告
新生初赛题目.解题思路.参考代码一览 A. 拒绝虐狗 Problem Description CZJ 去排队打饭的时候看到前面有几对情侣秀恩爱,作为单身狗的 CZJ 表示很难受. 现在给出一个字符串代 ...
- SCNU ACM 2016新生赛初赛 解题报告
新生初赛题目.解题思路.参考代码一览 1001. 无聊的日常 Problem Description 两位小朋友小A和小B无聊时玩了个游戏,在限定时间内说出一排数字,那边说出的数大就赢,你的工作是帮他 ...
- 【Mutual Training for Wannafly Union #1 】
A.Phillip and Trains CodeForces 586D 题意:过隧道,每次人可以先向前一格,然后向上或向下或不动,然后车都向左2格.问能否到达隧道终点. 题解:dp,一开始s所在列如 ...
- 北京培训记day4
智商题QAQ-- T1:求>=n的最小素数,n<=10^18 暴力枚举n-n+100,miller-rabin筛法 T2:给定一个01矩阵,每次选择一个1并将(x,y)到(1,1)颜色反转 ...
随机推荐
- 面向过程编程&面向对象编程
面向过程编程 Procedure Oriented Programming C语言是面向过程编程的,面向过程编程主要使用顺序.条件选择.循环三种基本结构来编写程序. 顺序:按照时间轴顺序完成每个处理: ...
- C语言异常处理
异常的概念-程序在运行过程中可能产生异常-异常(Exception)与Bug的区别 异常是程序运行时可预料的执行分支 Bug是程序中的错误,是不被预期的运行方式 异常(Exception)和Bug的对 ...
- HTML简介 页面标记
HTML简介 HTML 1.0 : 1993年 HTML 2.0 : 1995年 HTML 3.2 : 1997年 HTML 4.01 : 1999年 HTML 5 : 2008年 XML:可扩展标 ...
- 树莓派包含python2.7系统路径
- vue 多种方式控制style属性
一共用到了两种方式: 第一种:对象 第二种:数组 看代码: <!doctype html> <html lang="en"> <head> &l ...
- Paper | Xception: Deep Learning with Depthwise Separable Convolutions
目录 故事 Inception结构和思想 更进一步,以及现有的深度可分离卷积 Xception结构 实验 这篇论文写得很好.只要你知道卷积操作或公式,哪怕没看过Inception,也能看懂. 核心贡献 ...
- 中国移动明确5G手机入网技术标准:四大要求缺一不可!
原文: https://m.sohu.com/a/355533798_208899?strategyid=00014 日前,中国移动在2020年5G终端产品规划中明确了一系列详细的技术要求,针对明年入 ...
- sql语句优化的30种方法
转载于:https://www.cnblogs.com/Little-Li/p/8031295.html 1.对查询进行优化,应尽量避免全表扫描,首先应考虑在 where 及 order by 涉及的 ...
- VBA基础 - 函数和模块
概要 对于一般的 VBA 程序来说, 可能一个或几个函数就行了. 毕竟, VBA 只是作为 excel 的辅助工具来用的. 但是, 随着 VBA 写的越来越多, 用个工程来管理就有必要了, 而一个代码 ...
- 在Azure DevOps Server中运行基于Spring Boot和Consul的微服务项目单元测试
1 概述 谈到微服务架构体系,绕不开服务发现这个功能.服务发现机制是简化微服务配置.实现容灾.水平扩缩容.提高运维效率的重要方式.在服务发现工具中,Consul在部署和使用方面与容器结合的天衣无缝,成 ...