
html
乡野码夫
写字楼里写字间,写字间里程序员;
程序人员写程序,又拿程序换酒钱。
酒醒只在网上坐,酒醉还来网下眠;
酒醉酒醒日复日,网上网下年复年。
但愿老死电脑间,不愿鞠躬老板前;
奔驰宝马贵者趣,公交自行程序员。
别人笑我忒疯癫,我笑自己命太贱;
不见满街漂亮妹,哪个归得程序员?
展开
-
小的div在大的div中垂直居中
方法一:1、代码: <div style="width:200px;height:200px;border:solid blue;position:relative;"> <div style="width:100px;height:100px;margin: auto; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: red;"></div> </div转载 2022-01-16 17:51:58 · 262 阅读 · 0 评论 -
app对键盘的确认、收起操作
//点击键盘确认document.getElementById("search").addEventListener("keydown", function (e) { var self = this; if (e.keyCode == "13") { var search = $(self).val(); //点击键盘确认后的操作 }});//监听键盘收起(Android 处理) startconst originHeight = docu转载 2022-01-12 21:04:55 · 371 阅读 · 0 评论 -
a标签搞定文件谷歌和火狐的下载
<a title="下载" href="文件的路径" download="test.docx" >文件下载</a>原创 2021-08-03 20:51:32 · 412 阅读 · 0 评论 -
图片链接直接打开显示正常,放在img标签里就加载不出来的解决方法
因为从图片的链接是第三方地址,所以在有些浏览器可以会不兼容,导致不显示图片,比如谷歌不行,火狐却可以<img src="https://t7.baidu.com/it/u=1819248061,230866778&fm=193&f=GIF" width="200"height="200">添加//images.weserv.nl/?url=就可以解决了<img src="//images.weserv.nl/?url=https://t7.baidu.com/it/原创 2021-05-03 21:21:07 · 8711 阅读 · 5 评论 -
css不换行属性
html代码需要这样写:nowrap="nowrap"css代码这样写:white-space: nowrap;原创 2021-05-02 14:46:28 · 249 阅读 · 0 评论 -
encodeURI出现%20
今天后端问我一个问题,说页面地址参数名后会莫名多出一个%20,这样本来页面地址应该是https://h5.t.qingoo.cn/details?bookId=‘对应的书籍id’,但是实际上成了https://h5.t.qingoo.cn/details?bookId=%20+‘对应的书籍id’,这样就会使页面访问出错。URL里出现%20的原因的地址中存在的空格被转码成了%20,所以写一个正则对地址做个校验,有空格的话把它删掉就可以了。————————————————版权声明:本文为优快云博主「Cl转载 2021-03-07 16:22:08 · 730 阅读 · 0 评论 -
jq 如何获取多选框选中的值
jquery如何获取多选框选中的值,有两种方法1、通过id获取是否选中(单个)1)引入jquery文件2)Html设计如下<div> <span>运动类:</span> <div id="div1" style="position:relative;left:80px;margin-top:-16px;"> <input type="checkbox" size="12" name="Sports" id="Pingpon转载 2021-02-28 23:06:11 · 6552 阅读 · 0 评论 -
HTML中input多选框
<form action="">车型:<input type="checkbox" name="car" value="car1">雅阁<input type="checkbox" name="car" value="car2">思域<input type="checkbox" name="car" value="car3">特斯拉<input type="checkbox" name="car" value="car4">拉克萨斯&l原创 2021-02-28 23:02:46 · 4822 阅读 · 0 评论 -
html <ul> li前面的小点浏览器显示不出来
li 里面的点显示不出来,可能是设置了 margin或padding为0,或者list-style:none;原创 2021-02-28 22:58:14 · 4554 阅读 · 3 评论 -
html图片代码自适应大小
图片宽度用百分比:width:100%;原创 2021-01-23 21:42:30 · 1091 阅读 · 0 评论 -
html中a标签添加横线
<a href="ddrb/090630.asp" target="_blank" style="text-decoration:underline;">这里下面有横线的</a>原创 2021-01-02 17:39:06 · 1907 阅读 · 0 评论 -
html页面自动刷新
1.页面自动刷新:把如下代码加入区域中,其中20指每隔20秒刷新一次页面.2.页面自动跳转:把如下代码加入区域中,其中20指隔20秒后跳转到https://www.jb51.net页面3.页面自动刷新js版原创 2020-11-16 08:56:01 · 2382 阅读 · 0 评论 -
五张图片自动轮播(已完善)
与本人博客“五张图片自动轮播(未完善)”略有不同,但原理一样的,都是使用position的绝对位置改变html代码:注:图片路径替换一下,才能看出效果,并需要引用floatWindows.js和jquery.min.js两个js库<script src="../js/floatWindows.js?v=2020.04.17"></script><script src="https://cdn.staticfile.org/jquery/2.2.4/jquery.min.原创 2020-11-15 19:37:27 · 7958 阅读 · 1 评论 -
五张图片自动轮播(未完善的)
js代码: var curNum=0; var count=$("#inner").children('div').length;//8 setInterval("test()",5000); function test(){ //如果到了最后一个元素,停止 if((count-curNum)<=7){ curNum=0; $("#inner").css("left","0"); test(); // return false; } curNum+=1; $("#inne原创 2020-11-15 19:27:05 · 148 阅读 · 0 评论 -
js监听html页面的上下滚动事件方法
html代码:<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>Dome</title> <script type="text/javascript"> function scroll(){ //console.log("打印log日志");实时看下效果 console.log("开始滚动!"); }转载 2020-11-14 22:21:46 · 953 阅读 · 1 评论 -
html + js 简单实现轮播图
实现思路如下:设置所有图片的 display 属性为 none设置一个 index 用来标志获取到的图片设置一个定时器,每隔一段时间令 index 自增并将对应的图片的 display 属性改为 blockhtml代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>轮播图实现</title> <style转载 2020-11-07 23:23:17 · 1338 阅读 · 1 评论 -
html之无序列表和有序列表
无序列表html代码: <ul type=""> <li>苹果</li> <li>梨</li> <li>香蕉</li> </ul>有序列表html代码: <ol type=""> <li>苹果</li> <li>梨</li> <li>香蕉</li>原创 2020-11-07 20:57:05 · 503 阅读 · 0 评论 -
HTML 表格中的行合并与列合并
colspan是横向合并;rowspan是纵向合并<td colspan="4" >ss</td><td rowspan="3"> </td>原创 2020-10-24 22:18:43 · 3091 阅读 · 0 评论 -
html中引用前端模板引擎:Handlebars
html代码<script src="./js/handlebars-1.0.0.beta.6.js"></script><script type="text/template" id="myTemplate"> <div class="demo"> <h1>{{name}}</h1> <p>{{content}}</p> </div></原创 2020-08-02 18:00:46 · 322 阅读 · 0 评论 -
jQuery打印插件jqprint
js代码<script language="javascript">function a(){ $("#print").jqprint(); }html代码<div id="print"> <table> <tr> <td>test</td> <td>test</td> <t原创 2020-08-01 21:55:09 · 349 阅读 · 0 评论 -
像素之间的转换 之 px与rem的转换
CSS3中的Rem值与Px之间的换算bootstrap默认 html{font-size: 10px;}rem是一个相对大小的值,它相对于根元素总结:px转换成rem要除100rem转换成px要乘100注:px是固定像素的,rem是自适应像素的,一般使用rem...原创 2020-07-31 21:23:45 · 1462 阅读 · 0 评论 -
html 让其中一个div浮在另一个div上面
html 让其中一个div浮在另一个div上面 通常情况下,有两种实现方法:(1) 浮动的元素设置float属性(2) 浮动的元素设置position属性为 absolute, 另一个元素设置position属性为 relative。步骤1、设置float属性2、浮动的元素设置position属性为 absolute, 另一个元素设置position属性为 relative具体实现代码如下:<html><head><style type="text/css"转载 2020-07-15 23:59:03 · 12745 阅读 · 0 评论 -
$(‘#first-step .next-btn‘).off().on(‘click‘, function (){})) 的详解
html代码<div class="content-wrapper" id="first-step"> <div class="div-content-div-btn"> <div class="next-btn">下一步</div> </div></div>JS代码//$('#first-step .next-btn' 先获取到id为first-step的div,在获取到class为next-btn原创 2020-07-15 23:46:17 · 362 阅读 · 0 评论 -
jQuery实现html的table表的th和td标签的显示和隐藏
html代码<th class="th_name">name</th><td class="td_name">张三</td>js代码$("th.th_hello").hide(); // 隐藏th$("th.th_hello").show(); // 显示th$("td.td_hello").hide(); // 隐藏td$("td.td_hello").show(); // 显示td...原创 2020-07-13 21:03:10 · 5059 阅读 · 1 评论