- 博客(16)
- 资源 (2)
- 收藏
- 关注
原创 js缓动动画效果
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <titl
2021-12-19 21:40:01
260
原创 倒计时效果案例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <tit.
2021-12-13 23:16:50
526
原创 判断一个字符串中出现次数最多的字符,并统计其次数。
<script> var str = "abcoefoxyozzopp"; var o = {}; //对象 //1.遍历字符串 for (var i = 0; i < str.length; i++) { var chars = str.charAt(i); //chars是 字符串里的每一个字符 if (o[chars]) { //o[ch.
2021-12-07 12:06:19
775
原创 倒计时案例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <tit.
2021-12-05 23:07:16
728
原创 移动端布局笔记
1.移动web流式布局 1.移动端基础 兼容移动端主流浏览器,处理Webkit内核浏览器即可。 学会用谷歌浏览器模拟手机界面及调试。 2.视口 视口(viewport)就是浏览器显示页面内容的屏幕区域。视口可分为布局视口、视觉视口和理想视口。 2.1布局视口 layout viewport 一般移动设备的浏览器都默认设置了一个布局视口,用于解决早期的PC端页面在手机上显示的问题。 iOS,Android基本都将这个视口分辨率设置为980px,所以PC上的网页大多都能在手机上呈现,只不过元素看上去很小,一般
2021-11-28 23:55:35
380
原创 CSS3D动画-旋转木马效果
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <titl
2021-11-21 17:39:28
145
原创 CSS动画效果-奔跑的熊
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <titl
2021-11-21 13:52:20
621
原创 热点图小案例
<title>热点图案例</title> <style> .map { position: relative; width: 658px; height: 544px; background: url(../images/map1.jpg); margin: 0 auto; } .city { position: absolute;.
2021-11-21 12:31:09
704
原创 品优购商城前端项目HTML+CSS
index.html <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
2021-11-19 23:26:21
651
原创 CSS中 文字超出部分用省略号显示
必须满足三个条件: ①先强制一行内显示文本 white-space: nowrap; ( 默认 normal自动换行) ②超出的部分隐藏 overflow:hidden; ③文字用省略号替代超出的部分 text-overflow: ellipsis; <style> .show { margin: 30px auto; width: 100px; height: 50px; bac
2021-11-19 17:45:22
413
原创 CSS详细笔记
1.CSS简介 CSS的主要使用场景就是美化网页,布局页面的。 1.1HTML的局限性 说起HTML,这其实是个非常单纯的家伙,他只关注内容的语义。比如表明这是一个大标题,表明这是一个段落,表明这儿有一个图片,表示此处有链接。 1.2 CSS-网页的美容师 CSS是层叠样式表(Cascading Style Sheets)的简称. 有时我们也会称之为CSS样式表或级联样式表。 总结: HTML主要做结构,显示元素内容. CSS美化 HTML,布局网页. CSS最大价值:由HTML专注去做结构呈现,样式交给
2021-11-15 20:28:52
941
原创 CSS初始化代码
/* 把所有标签的内外边距清除 */ { margin:0; padding:0 } / em和i 斜体的文字不倾斜 / em,i{ font-style:normal; } / li标签清除前面小圆点 */ li{ list-style:none; } img{ /* border:0;照顾低版本浏览器 如果图片外面包含了链接会有边框的问题 / border:0; / 取消图片底侧有空白缝隙的问题 / vertical-align:middle; } button{ / 当我们鼠标经过button 按钮的
2021-11-13 18:15:58
99
原创 CSS三角妙用
<!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>D.
2021-11-13 17:44:28
381
原创 学成在线前端html+css源码
html部分: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />...
2021-11-11 17:34:05
459
原创 Javascript笔记
1、什么是JavaScript 1.1、概述 JavaScript是一门世界上最流行的脚本语言 Java、JavaScript =一个合格的后端人员,必须要精通JavaScript= 1.2、历史 https://www.w3school.com.cn/js/pro_js_history.asp ECMAScript它可以理解为是JavaScript的一个标准 最新版本已经到es6版本 但大部分浏览器还只停留在支持es5版本 问题:开发环境和线上环境,版本不一致 2、快速入门 2.1、引入JavaScrip
2021-10-27 20:34:39
673
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人