meta | 易学教程

Jquery鼠标点击出现文字

阅读更多关于 Jquery鼠标点击出现文字

点击鼠标左键出现文字效果。原理解说 1.首先确定你是不是点的鼠标左键； 2.文字效果要出现在你鼠标点击的地方； 3.点击后文字出现一个由下往上的显示效果； 4.点击完成后固定时间内还得消失效果演示代码演示 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Onclick</title> </head> <style> .body { height : 900px ; width : 100% ; background-color : black ; } </style> <body class="body"> </body> <script src="js/jquery.js"></script> <script> $(".body").mousedown(function(e) { var arr = ['新年快乐','大吉大利','万事如意','年年有余','五福临门','岁岁平安','红红火火','热热闹闹','春暖花开','阳光明媚'

CSS3: 快速制作页面加载动画

阅读更多关于 CSS3: 快速制作页面加载动画

介绍3个简单的案例：案例1： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>页面加载动画</title> <link rel="stylesheet" href="css/style.css"> <link rel="stylesheet" href="css/loader1.css"> </head> <body> <div class="loader"> <div class="circle"></div> <div class="circle"></div> </div> </body> </html> /* 通用样式 */ *{ padding: 0; margin: 0; box-sizing: border-box; } body{ font-family: sans-serif; font-size: 18px; line-height: 1.6; background: linear-gradient(135deg,

Jquery实现数字华容道小游戏

阅读更多关于 Jquery实现数字华容道小游戏

< ! DOCTYPE html > < html > < head > < meta charset = "utf-8" > < title > 数字华容道 < / title > < script type = "text/javascript" src = "jquery.min.js" > < / script > < style type = "text/css" > * { padding : 0 px ; margin : 0 px ; } #btns > button { width : 100 px ; height : 30 px ; border : none ; background : # 0082 df ; color : white ; } #content { text - align : center ; margin : 0 auto ; } #grid { border : 1 px solid # 0082 df ; width : 300 px ; margin : 20 px auto ; height : 300 px ; } #grid > div { float : left ; width : 33 % ; background : gray ; height : 33 % ; margin - bottom : 1 px ;

web前端绘制0.5像素的几种方法

阅读更多关于 web前端绘制0.5像素的几种方法

　　最近完成了公司安排的移动web触屏开发，期间涉及到在移动设备上显示线条，最开始采用PC常用的css board属性来显示1个像素的线条，但是发现在移动设备上并不美观，参考淘宝、京东的触屏发现它们均是采用浅细的线条来显示在移动设备上。　　以下纪录了比较方便的4种绘制0.5像素线条方式一、采用meta viewport的方式，这个也是淘宝触屏采用的方式常用的移动html viewport的设置如下 <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> 具体意思就不多提，它就是让页面的高宽度即为设备的高宽像素，而为了方便绘制0.5像素的viewport的设置如下 <meta name="viewport" content="initial-scale=0.5, maximum-scale=0.5, minimum-scale=0.5, user-scalable=no" /> 这样html的宽高就是设备的2倍，此时依然使用css board为1像素的话，肉眼看到页面线条就相当于transform:scale(0.5)的效果，即为0.5像素但是这种方式涉及到页面整体布局规划以及图片大小的制作，所以若采用这个方式还是事先确定为好二、采用 border

driver.page_source returns only meta name=“ROBOTS” content=“NOINDEX, NOFOLLOW” using Selenium

阅读更多关于 driver.page_source returns only meta name=“ROBOTS” content=“NOINDEX, NOFOLLOW” using Selenium

问题 I want to scrape one website, to get the page content with this code: from selenium import webdriver from selenium.webdriver.common.desired_capabilities import DesiredCapabilities driver = webdriver.Remote("http://adress:4444/wd/hub", DesiredCapabilities.CHROME) link = 'website_url' driver.get(link) s = driver.page_source print((s.encode("utf-8"))) driver.quit() this is what receive: <meta name="ROBOTS" content="NOINDEX, NOFOLLOW"> I also tried a lot of different ways, Luminati, proxy

前端学习（462）：递归求和

阅读更多关于前端学习（462）：递归求和

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>递归</title> </head> <body> <script> // 递归求和 var i=0; var sum=0; function getSum(){ i++; sum+=i; if(i>100){ return sum; } return getSum(); } getSum(); console.log(getSum()); </script> </body> </html> 运行结果来源： CSDN 作者：你知道歌谣吗？链接： https://blog.csdn.net/weixin_43392489/article/details/104051259

前端学习（463）：累加原理

阅读更多关于前端学习（463）：累加原理

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <script> var i=0; var sum=0; function fn0(){ i++;//i=1 sum+=i;//sum=1 return fn1(); } function fn1(){ i++;//i=2 sum+=i;//sum=3 return fn2(); } function fn2(){ i++;//i=3 sum+=i;//sum=6 if(i>2){ return sum; } } </script> </body> </html> 运行结果来源： CSDN 作者：你知道歌谣吗？链接： https://blog.csdn.net/weixin_43392489/article/details/104052388

浮动

阅读更多关于浮动

最近在学浮动的知识，下面总结了一些浮动的一些特征 1. 块级元素浮动将并排显示，不再独占一行示例代码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> .box2{ width: 100px; height: 100px; border: 1px solid #ccc; background-color: skyblue; } </style> </head> <body> <div class="box2"></div> <div class="box2"></div> </body> </html> 效果：修改： <style> .box2{ width: 100px; height: 100px; border: 1px solid #ccc; background-color: skyblue; float: left;/*新增*/ } </style> 修改效果： 2.

javascript当中onload用法

阅读更多关于 javascript当中onload用法

7）onload onload就是等页面加载完后才执行。例 3.7.1 <HEAD> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> <BODY onload='a("a","b","c")'> part2,onload 会在ｐａｒｔ１和ｐａｒｔ２打印之后再执行。 </BODY> 文章转载自： https://blog.csdn.net/qq_44594249/article/details/100091795 来源： https://www.cnblogs.com/renzhe111/p/12222044.html

Java Script基础

阅读更多关于 Java Script基础

JavaScript只是一种运行于客户端，可以被客户端浏览器解析的一段代码。它和java没有任何关系。JavaScript简称JS。jQuery是对JS的一个封装。一.网页引入Java Script的三种方式： 1.引入外部js文件 2.在当前HTML页面中使用script标签中书写 3.直接在当前HTML标签中书写二.变量的声明和赋值 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <style type="text/css"> div { color:red; } </style> <script src="MyJS.js"></script> <script type="text/javascript"> var num = 0; var num1, num2, num3 = 0; </script> </head> <body> <div>哪里来的JS？</div> <input type="button" onclick="javascript: alert('按钮');" value="点我"/> </body>

订阅 meta