datuzidppd5556的博客

引入地址栏里的小图标 <link rel="icon" href="./favicon.ico" type="image/x-icon"> href里的地址是可以改变的 引入字体图标： 1. <link rel="stylesheet" href="./assets/font/iconfont.css"> 2.把dem-index.html中的“第一步”和“第二步”的...

学习javascript两天能写图片切换了： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> ...

有一点编程基础的同学都能看懂 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <met...

鼠标点击事件小结： onclick：点击事件 ondblclick：双击事件（必然会触发单击事件）； onmouseover：鼠标移入； onmouseout：鼠标移出； onmouseenter：鼠标移入； onmouseleave：鼠标移出； onmousemove：鼠标在元素中移动； onmousedown：鼠标按下； onmouseup：鼠标抬起； oncontextmenu：鼠标右键事件...

简单的js代码实现一些功能 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta...

js写九九乘法表 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-...

新闻标题的隔五行换色 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http...

js控制开关灯泡 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-e...

js的简单应用 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-eq...

js实现计算器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-eq...

img标签是插入图片使用的，background-img:url();是插入背景图片使用的。 相同点：都是插入图片。 不同点：1.img标签先于background-img:url();加载。因为：结构先加载，样式后加载。 2.img标签如果加载失败，会留下痕迹。img里的alt=“图片加载失败的提示信息写在这里”。 但是background-img:url();不会。 3.img如果没有加载完，...

5大常用浏览器及其内核： chrome（webkit—>blink） safari(webkit) FireFox:(Gecko) IE (trident) opera(presto)

常见的浏览器的兼容性问题 IE8常见的兼容性问题： 1.图片边框问题;a标签里面套上img标签，会有图片边框。 解决办法：border:none/0; 2.背景属性的符合写法问题：background：url()no-repeat center; 解决办法：background：url() no-repeat center;(注意加上空格就行) IE7常见的兼容性问题解决： 1.块...

图片优化：1.选择合适的图片尺寸。2.使用精灵图，减少页面请求次数。3.压缩图片。4.使用svg技术替换图片。5.用字体图标库代替图片。6.用css和css3制作简单的图标和动画代替gif。7.图片延迟加载。 ...

总结的不全，仅供参考哦！ html5新增标签：（header, nav, article, section, footer , video, audio…） html5新增type类型：email tel number surch date range color time month url week… html5兼容性问题解决办法：1. document.createEle...

简单的动画 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equi...

平移属性实现小球滚动 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http...

手风琴代码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equ...

单行文本溢出 div{ width：200px； overflow：hidden; //溢出的文本切掉 text-overflow：ellipsis；//文本溢出显示省略号 white-space：nowrap；//文本不换行 } 多行文本溢出显示省略号 div{ width：200px； overflow：hidden； text-overflow：ellipsis； disp...

移动端的四大布局： 1.固定布局：以px为单位，写好视口，与移动端的写法一样。 2流式布局：宽度设置%，设置最大和最小宽度。 3.rem布局：以rem为单位，设置跟标签的字体大小。通过媒体查询查询屏幕的宽度。 4.响应式布局：通过媒体查询查询屏幕的宽度，调用不同的样式结构。 ...