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)颜色反转 ...

随机推荐

使用DRF来快速实现API调用服务
本帖最后由范志远于 2019-3-19 16:55 编辑增加加载Djagno REST Framework模块的选项对于settings.py文件的INSTALLED_APPS增加'rest_ ...
python的wraps函数
当使用@修饰符修饰函数时,会存在这样一个问题:被修饰的函数会消失(这是因为修饰函数没有设置返回值,如果设置了返回值,则就把返回值赋给被修饰函数,比如,test1函数的返回值设置为 return 6, ...
TeamyinyinFish-> 测试报告
测试人员 1. 姓名:鱼嘤嘤 2. 年龄: 21 3. 职业: 大三学生 4. 感情状况: 单身用户故事软件工程课上,老师想要他们组实现一个小组项目,鱼嘤嘤原本想摸鱼,但是转念一想觉得还是需要好 ...
并行计算：并行I/O服务器的操作参数
视频来源:新竹清华大学:并行计算与并行编程课程上图结论:随着年限,计算力的增长很快,而I/O近于平缓,二者之间的差距增大,带来不利的影响.需要一些方法来处理这较大的差距. 解决方案: 1:I/O 内 ...
【ECNU3542】神奇的魔术（二分交互题）
点此看题面大致题意: 有一个\(1\sim 2^n\)的排列,\(n\le7\),每次交互告诉你有几个位置上的数是正确的,让你在\(1000\)轮以内猜出每个位置上的数. 二分显然,我们可以通过二 ...
P2按要求补全表达式
---恢复内容开始--- #include<stdio.h> int main () { int x; printf("输入一个整数"); scanf(" ...
安卓模拟器可访问电脑ip配置
开发的时候,发现安卓模拟器没办法访问调用开发的接口,因为安卓模拟器没有绑定配置hosts,所以需要在模拟器上配置hosts 首先配置环境变量,用户变量的path和系统变量我的路径 C:\Users\ ...
FineUIPro v6.0.0 大版本更新，快来围观！
本月末(2019-09-20),我们会发布激动人心的 FineUI v6.0.0 版本,这个版本将带来一系列的重要更新! 在列举新版本特性之前,我们先来回顾下每次发布大版本的关键时间点: v1.0.0 ...
HTML连载21-序选择器上
解释CSS3 中新增的选择器中最具有代表性的就是序选择器,大致可以分为两类: (1)同级别的第几个(2)同类型的第几个先写一个公共代码 <body> <h1>优秀</h ...
PCL学习之：将超声数据按照PCL点云方式发布出去
前言:基于2D激光雷达的机器人,想让它跑自动导航,众所周知有2个比较明显的缺陷,1,那就是普通的激光雷达无法对玻璃或是镜面物体有反映; 2,机器人避障时只能对某一个平面的物体有反映,超过或者低于这个平 ...

html 后手

html 后手的更多相关文章

随机推荐

热门专题