[Web 前端] 004 html 小练习
1. 锚点
- 用法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>锚点</title>
</head>
<body>
<b id="top1">图片一</b>
<img src="./images/001.jpg" alt="不好意思,加载失败了~"> <br>
<b id="top2">图片二</b>
<img src="./images/002.jpg" alt="不好意思,加载失败了~"> <br>
<b id="top3">图片三</b>
<img src="./images/003.jpg" alt="不好意思,加载失败了~"> <br>
<a href="#top1">跳转到图片一</a>
<a href="#top2">跳转到图片二</a>
<a href="#top3">跳转到图片三</a>
</body>
</html>
- 效果
锚点
图片一
图片二
图片三
跳转到图片一
跳转到图片二
跳转到图片三
- 说明
- 方便起见,图片并不存在
- 下方三个 a 标签相当于“超链接”,点哪个,回到哪张图
2. <label> 标签
- 记 html 的笔记时可以偷个懒(不写全),如下
- 用法
<form action="" method="POST">
<p>
<label>用户名:</label><input type="text" name="username" value="阿强">
</p>
<p>
<label>密 码:</label><input type="password" name="password">
</p>
<p>
<input type="submit" name="" value="提交">
<input type="reset" name="" value="重置">
</p>
</form>
- 效果
用户名:
密 码:
3. 表格
之前的随笔已经介绍过表格了,这里是借表格挖个排序算法的坑
用法
<table border="1" cellpadding="5px" cellspacing="0" width="700px" height="500px">
<thead>
<tr>
<th colspan="7">常见排序列表</th>
</tr>
<tr>
<th>中文名称</th>
<th>英文名称</th>
<th>平均<br>时间复杂度</th>
<th>最坏<br>时间复杂度</th>
<th>最好<br>时间复杂度</th>
<th>空间<br>复杂度</th>
<th>稳定性</th>
</tr>
</thead>
<tbody>
<tr>
<td>选择排序</td>
</tr>
<tr>
<td>冒泡排序</td>
</tr>
<tr>
<td>插入排序</td>
</tr>
<tr>
<td>堆排序</td>
</tr>
<tr>
<td>希尔排序</td>
</tr>
<tr>
<td>归并排序</td>
</tr>
<tr>
<td>快速排序</td>
</tr>
<tr>
<td>桶排序</td>
</tr>
<tr>
<td>计数排序</td>
</tr>
<tr>
<td>基数排序</td>
</tr>
</tbody>
</table>
- 效果
常见排序列表 | ||||||
---|---|---|---|---|---|---|
中文名称 | 英文名称 | 平均 时间复杂度 |
最坏 时间复杂度 |
最好 时间复杂度 |
空间 复杂度 |
稳定性 |
选择排序 | ||||||
冒泡排序 | ||||||
插入排序 | ||||||
堆排序 | ||||||
希尔排序 | ||||||
归并排序 | ||||||
快速排序 | ||||||
桶排序 | ||||||
计数排序 | ||||||
基数排序 |
[Web 前端] 004 html 小练习的更多相关文章
- Web前端_微信小程序实战开发
微信小程序开发实战教程 一.微信小程序 它是一种混合开发的方式. 是安装在微信中的程序(一个程序最多2M空间). 1.1 注册 1 2 点击立即注册:进入下方页面 3 4 点击小程序进入表单填写页 ...
- web前端页面设计小笔记
input总是在点击的时候出现蓝色边框,这是input的默认属性,就算设置了border:none:也没有用! #解决方法:outline:none; 设置input框里的placeholder值得字 ...
- web前端几个小知识点笔记
1.css实现宽度是百分比的盒子为正方形 <div style="width:50%;padding-bottom:50%;height:0px;background:#ccc;&qu ...
- web前端 -- 页面设计小技巧
1:进入网页时淡入淡出的效果. <meta http-equiv=”Page-Exit”; content=”blendTrans(Duration=1.0)”> 在头部head之间加入此 ...
- 定一个小目标:明年1024能成功转行web前端,光荣地成为一个程序员!
第一次在博客园写博,我为什么要选择这里吗? 据说博客园这里的IT大牛如云,作为一个求知若渴的小白,我屁颠屁颠的跟着过来了. 于是今天早上兴高采烈的注册了账号,迫不及待的打开我的博客,呃!注册账号成功了 ...
- web前端性能测试小点
关于前端性能的文章: http://www.cnblogs.com/fnng/archive/2011/09/19/2181894.html web应用的前端性能响应时间指浏览器的页面加载时间.浏览器 ...
- 漫谈程序员(十一)老鸟程序员知道而新手不知道的小技巧之Web 前端篇
老鸟程序员知道而新手不知道的小技巧 Web 前端篇 常充电!程序员只有一种死法:土死的. 函数不要超过50行. 不要一次性写太多来不及测的代码,而是要写一段调试一段. UI和编码要同步做. 多写注释方 ...
- Web 前端面试小知识
简历投递 前期为了解自身短板, 可以海投一些试试. 不建议长期海投简历, 对用人单位简历筛选和你自身都没什么好处. 投简历之前最起码要关注以下几点(薪资范围, 公司位置, 职位要求, 是否为培训机构冒 ...
- Web前端开发最佳实践(7):使用合理的技术方案来构建小图标
大家都对网站上使用的小图标肯定都不陌生,这些小图标作为网站内容的点缀,增加了网站的美观度,提高了用户体验,可是你有没有看过在这些网站中使用的图标都是用什么技术实现的?虽然大部分网站还是使用普通的图片实 ...
随机推荐
- hdu 1059 Dividing bitset 多重背包
bitset做法 #include <bits/stdc++.h> #define PI acos(-1.0) #define mem(a,b) memset((a),b,sizeof(a ...
- nginx_mirror_module流量复制在项目中的应用
参考文档:https://my.oschina.net/andChow/blog/2873870 https://blog.csdn.net/lancerh/article/details/88645 ...
- DevExpress v19.1新版亮点——WinForms篇(二)
行业领先的.NET界面控件DevExpress v19.1终于正式发布,本站将以连载的形式介绍各版本新增内容.在本系列文章中将为大家介绍DevExpress WinForms v19.1中新增的一些控 ...
- 在父组件中,传值给子组件-vue
1.通过 props <x-test :name="username"></x-test>1)props为字符串数组 props: ['name']2)pr ...
- vue-cli项目中引入全局scss
加载一个全局设置文件 在每个组件里加载一个设置文件,而无需每次都将其显式导入,是一个常见的需求.比如为所有组件全局使用 scss 变量.为了达成此目的: npm install sass-resour ...
- MongoDB的分页排序
我们已经学过MongoDB的 find() 查询功能了,在关系型数据库中的选取(limit),排序(sort) MongoDB中同样有,而且使用起来更是简单 首先我们看下添加几条Document进来 ...
- postman-鉴权
概念 Cookie和鉴权的区别,cookie一般指缓存在本地的数据:鉴权一般指验证用户是否拥有访问系统的权利 鉴权分类 Basic auth:基础鉴权,数据没有加密可明文显示,一般在测试环境使用,不在 ...
- 安装VS2017
www.visualstudio.com/zh-hans/downloads/ https://visualstudio.microsoft.com/zh-hans/thank-you-downloa ...
- spring IOC(Spring 生命周期,先1.构造方式,2,初始化方法,3,目标方法,4,销毁方法)
- mybatis config 快速生成xml DAO
0.加jar包 1.a.BAT java -jar E:\GZH\Mybaits\mybatis-generator-core-1.3.2\lib\mybatis-generator-core-1.3 ...