2019 年 1月 25 日随笔档案 - 伊人怎会持宠而骄

2019年1月25日

摘要： <!doctype html> <html> <head> <meta charset='utf-8'> <link rel='stylesheet' href='外部的css文件路径' /> <title>demo</title> <style> /* 整体设置 */ *{margin:0px;p 阅读全文

posted @ 2019-01-25 15:41 伊人怎会持宠而骄阅读(161) 评论(0) 推荐(0)

纪录片列表展示

摘要： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>搜狐视频记录片列表展示</title> <style> html, body, div, h2, ul, li, p { padding: 0; margin: 阅读全文

posted @ 2019-01-25 14:07 伊人怎会持宠而骄阅读(133) 评论(0) 推荐(0)

上下移动（鼠标在上半部分往上走，反之相反）

摘要： <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> *{ margin:0; padding:0; } .xiaomi{ width:512px; height:400px; o 阅读全文

posted @ 2019-01-25 14:01 伊人怎会持宠而骄阅读(804) 评论(0) 推荐(0)

鼠标滑过、图片对应的文字高亮

摘要： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <style> li{ list-style: none; float: left; text-align: center; } </style> 阅读全文

posted @ 2019-01-25 14:00 伊人怎会持宠而骄阅读(296) 评论(0) 推荐(0)

QQ聊天字体选择

摘要： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>自定义字体形状</title> <style> html, body { margin: 0; padding: 0; } #wrap { background 阅读全文

posted @ 2019-01-25 13:59 伊人怎会持宠而骄阅读(328) 评论(0) 推荐(0)

字母打字练习

摘要： <html> <head> <meta charset="utf-8"> <title>打字游戏</title>  <link rel="stylesheet" href="animate.css"> <style> body{ margin: 0; / 阅读全文

posted @ 2019-01-25 13:58 伊人怎会持宠而骄阅读(399) 评论(0) 推荐(0)

基础样式设置

摘要： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>JS基础热身课练习</title> <style> * { margin: 0; padding: 0; } body { position: relativ 阅读全文

posted @ 2019-01-25 13:56 伊人怎会持宠而骄阅读(94) 评论(0) 推荐(0)

switch嵌套--猜拳游戏

摘要： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> </body> </html> <script> /* 设计一个猜拳游戏：假设： 1代表石头 2代表剪刀 3代表布计算机每次随阅读全文

posted @ 2019-01-25 13:55 伊人怎会持宠而骄阅读(627) 评论(0) 推荐(0)

克隆应用

摘要： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <table border = "1" id="tab"> <tr> <td> <input type="checkbox"/> < 阅读全文

posted @ 2019-01-25 13:54 伊人怎会持宠而骄阅读(88) 评论(0) 推荐(0)

三次机会猜数字

摘要： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <input type="button" value="请猜数" id="oBtn" /> </body> </html> <scr 阅读全文

posted @ 2019-01-25 13:54 伊人怎会持宠而骄阅读(733) 评论(0) 推荐(0)

聊天对话框（ctrl+enter发送）

摘要： <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>聊天对话框</title> <style type="text/css"> *{font-size: 14px; padding:0; margin:0;} .main{ po 阅读全文

posted @ 2019-01-25 13:53 伊人怎会持宠而骄阅读(422) 评论(0) 推荐(0)

加油问题

摘要： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> </body> </html> <script> /* 一个加油站为了鼓励车主多加油，所以加的多有优惠。（嵌套） 92 号汽油，每升阅读全文

posted @ 2019-01-25 13:52 伊人怎会持宠而骄阅读(350) 评论(0) 推荐(0)

勾股定理

摘要： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <input type="text" value="" id="num1"/> <span>+</span> <input type 阅读全文

posted @ 2019-01-25 13:51 伊人怎会持宠而骄阅读(171) 评论(0) 推荐(0)

委托应用-表单的创建和编辑

摘要： <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>DOM操作</title> </head> <style> #detail{ widt 阅读全文

posted @ 2019-01-25 13:50 伊人怎会持宠而骄阅读(187) 评论(0) 推荐(0)

学生成绩表（输入成绩后自动算出最高、最低、平均分）

摘要： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <h3>千峰H5成绩计算表</h3> <table> <tr> <td>班级名称：</td> <td><input type="te 阅读全文

posted @ 2019-01-25 13:49 伊人怎会持宠而骄阅读(929) 评论(0) 推荐(0)

完美拖拽（点击回放运动轨迹）

摘要： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>完美拖拽</title> <style type="text/css"> html,body{overflow:hidden;} body,div,h2,p{margin:0;pa 阅读全文

posted @ 2019-01-25 13:47 伊人怎会持宠而骄阅读(240) 评论(0) 推荐(0)

实心图案

摘要： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> </body> </html> <script> //打印四行五列的矩形 for( var i = 1 ; i <= 4 ; i+ 阅读全文

posted @ 2019-01-25 13:46 伊人怎会持宠而骄阅读(157) 评论(0) 推荐(0)

批量删除

摘要： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <input type="text" id="t"/> <input type="button" id="btn" value="留阅读全文

posted @ 2019-01-25 13:44 伊人怎会持宠而骄阅读(142) 评论(0) 推荐(0)

微博发布

摘要： <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> ul{ list-style-type: none;} *{margin:0;padding: 0;} .box { marg 阅读全文

posted @ 2019-01-25 13:44 伊人怎会持宠而骄阅读(127) 评论(0) 推荐(0)

模拟垂直滚动条

摘要： <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> .box { width: 300px; height: 500px; border: 1px solid red; marg 阅读全文

posted @ 2019-01-25 13:43 伊人怎会持宠而骄阅读(139) 评论(0) 推荐(0)

数组去重的方法

摘要： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> </body> </html> <script> /* 2、编写函数has(arr , num) 判断数组中是否存在num这个元素阅读全文

posted @ 2019-01-25 13:43 伊人怎会持宠而骄阅读(134) 评论(0) 推荐(0)

点不到的NO

摘要： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> html,body{ margin:0; padding:0; width:100%; height:100%; } #box{ width:12 阅读全文

posted @ 2019-01-25 13:42 伊人怎会持宠而骄阅读(80) 评论(0) 推荐(0)

九九乘法表和空直角

摘要： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> </body> </html> <script> //乘法表 for(var i = 1; i <= 9; i++) { for(v 阅读全文

posted @ 2019-01-25 13:41 伊人怎会持宠而骄阅读(340) 评论(0) 推荐(0)

表格的创建和删除

摘要： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> 行：<input type="text" id="r" /> 列：<input type="text" id="c" /> <inp 阅读全文

posted @ 2019-01-25 13:40 伊人怎会持宠而骄阅读(132) 评论(0) 推荐(0)

彩色签名

摘要： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <style type="text/css"> .active{ width: 10px; height: 10px; position: abs 阅读全文

posted @ 2019-01-25 13:40 伊人怎会持宠而骄阅读(89) 评论(0) 推荐(0)

限制留言条数

摘要： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <input type="text" id="t"/> <input type="button" id="btn" value="留阅读全文

posted @ 2019-01-25 13:38 伊人怎会持宠而骄阅读(132) 评论(0) 推荐(0)

随鼠标运动的彩色小球

摘要： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>小球运动</title> <style type="text/css"> p { border-radius: 50%; width: 30px; height: 30px; po 阅读全文

posted @ 2019-01-25 13:36 伊人怎会持宠而骄阅读(159) 评论(0) 推荐(0)