![](https://img-blog.csdnimg.cn/20201014180756780.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
自学日记
郑铭铭
I am single dog~
展开
-
Other_1.利用JS伸缩变动导航栏宽度的效果。
该教程是我从慕课网上学习到的,觉得对初学JS有比较好的帮助。 JS伸缩变动导航栏效果 *{margin: 0;padding: 0;text-decoration: none;list-style: none;} nav{width: 100%;height: 40px;border-bottom: 10px solid #FC751B转载 2017-02-08 15:03:29 · 654 阅读 · 0 评论 -
HTML中显示特殊字符,如尖括号 “<”,">"等等
这几天,做个网页,之后进行解析,总是出错。最后发现是因为错误的使用了尖括号 “"。如下面的html代码: 显示: 上面的value属性值中含有“在网上搜了一下,如果要在标签中显示""等特殊字符,可以使用“&”开头,“;”结尾,中间加上字符对应的编码就可以啦。如: > > >= ≥转载 2017-02-24 10:19:12 · 4578 阅读 · 0 评论 -
HTML <frameset> 标签 cols 属性
HTML 标签cols属性HTML中标签的cols属性包含了一个由逗号分隔的列表,这个列表指定了包含在一组框架中的列数和各列的大小。提示:左右分割窗口就是在浏览器中沿垂直方向分割为几个窗口,这些窗口左右分布。语法 ......属性值列表项从左向右指定各列。列的大小可以使用三种格式指定,也可以混合使用。1. 可以给一个列分配一个固转载 2017-02-25 16:28:34 · 4050 阅读 · 0 评论 -
用JS来控制DIV窗口的宽高
在一次用JS做注册页面验证的时候,突然想美化一下。然后就弄了一张背景图片作为网页背景,但是发现,我在css里面给大DIV设置了一个height:100%,背景图片尺寸是cover,可是背景图片并没有根据我窗口放大缩小发生改变,这时候我就上网找了下,终于知道了方法,可以用js里面的document.documentElement.clientWidth和document.documentElemen原创 2017-03-11 17:05:44 · 1525 阅读 · 0 评论 -
mask-image使用方法及其优点
mask-image是一个很新的东西,因为新所以支持它的浏览器就少,但是它很好用,该属性现在仅仅被webkit以私有属性支持。最新支持情况可查阅http://caniuse.sinaapp.com/html/item/css-masks/index.html一般来说mask-image需要一张有透明部分的图片,该图片用于遮挡在指定的dom上,被图片透明部分遮住的部分将不被显示,被不透明转载 2017-03-14 22:20:51 · 7001 阅读 · 0 评论 -
CSS3 filter(滤镜)
filter 属性定义了元素(通常是)的可视效果(例如:模糊与饱和度)。Filter 函数注意: 滤镜通常使用百分比 (如:75%), 当然也可以使用小数来表示 (如:0.75)。Filter描述none默认值,没有效果。blur(px)给图像设置高斯模糊。"radius"一值设定高斯函数的标准差,翻译 2017-06-22 17:28:02 · 405 阅读 · 0 评论 -
天气数据Api
想做天气APP,数据只能从别的地方接入了,以前Google的API不错,不过人家关了都不带告诉你,关了就关了,既不事先通知,事后也不发表声明!雅虎的以前还可以,现在的数据原来越少,越来越没用,所以,只能依靠天朝。本文章只供测试,如果有商业应用,请申请正规的API接口,因使用接口引起的商业纠纷与本人无关涨姿势:1.中央气象台:全国预报、气候预测、气候变化研究、气象信息收集分发服务的国家中心。2.中国气转载 2017-07-12 00:28:46 · 1348 阅读 · 1 评论 -
微信小程序--官方文档补充【操作反馈】--action-sheet组件
action-sheet组件是从底部弹出可选菜单项,估计也是借鉴iOS的设计添加的,action-sheet有两个子组件, action-sheet-item为每个选项,action-sheet-cancel取消选项,与action-sheet-item中间会有间隔,并且点击会触发action-sheet监听事件主要属性:wxml<!--触发action-sheet事件--><button typ转载 2017-07-15 19:28:03 · 1784 阅读 · 0 评论 -
微信小程序--官方文档补充【操作反馈】--modal组件
modal弹出框常用在提示一些信息比如:退出应用,清楚缓存,修改资料提交时一些提示等等。常用属性:wxml<!--监听button点击事件--><button bindtap="listenerButton" type="primary">弹出modal</button><!--弹出框--><modal title="退出应用" hidden="{{hiddenModal}}转载 2017-07-15 19:33:22 · 984 阅读 · 1 评论 -
微信小程序--官方文档补充【操作反馈】--toast组件
toast消息提示框,可用在提示一些信息,比如清楚缓存给用户一个友好的提示!或操作一些请求不想让用户有什么操作,toast也可以做到因为toast显示时其他操作是无效的主要属性:wxml<!--点击button触发toast--><button type="primary" bindtap="listenerButton">点击显示toast</button><!--toast消息框显示3秒,并转载 2017-07-15 19:34:11 · 583 阅读 · 0 评论 -
微信小程序--官方文档补充【操作反馈】--loading组件
loading通常使用在请求网络数据时的一种方式,通过hidden属性设置显示与否主要属性:wxml<!----><button type="primary" bindtap="listenerButton">显示loading</button><!--默认隐藏--><loading hidden="{{hiddenLoading}}">正在加载</loading>12341234jsPage转载 2017-07-15 19:34:45 · 597 阅读 · 0 评论 -
Github-README 中展示demo
http://www.jianshu.com/p/75e30889e70a转载 2017-07-16 12:38:41 · 495 阅读 · 0 评论 -
Other_8.如何来使用Html中的锚点连接(我觉得很有用,就转载了,非原创。互相学习)
锚点是网页制作中超级链接的一种,又叫命名锚记。命名锚记像一个迅速定位器一样是一种页面内的超级链接,运用相当普遍。那么他是如何来写的呢:这里可以放图标 也可以放文字您可以使用 id 属性来替代 name 属性,命名锚同样有效。在网页中,当你滚动到最底下想直接回到顶部的时候,这个时候就用到了锚链接,为了他的样式好看,你可以用Jquery去写,比如我们官网右侧的悬浮小图标转载 2017-02-12 12:54:48 · 560 阅读 · 0 评论 -
如何使一个ul居中在网页上,不设置宽
全部 前端开发 后端开发 移动开发 数据库 运维&测试 如何令这个ul居中在网页中,并且令每一个li水平并列显示呢?其实很简单,通过百度后学习到的知识点,就在于运用:display:inline-block;属性。以前我们会通过float:left属性让li水平显示,其实还有别的方法,就是用display:inline-block;。然后在ul标签原创 2017-02-20 16:03:25 · 670 阅读 · 0 评论 -
Other_7.一个比较简单的HTML+JS图片轮播效果
无标题文档#tab { overflow:hidden; width:400px; height:250px; position:relative; float:left;}#tab>img:not(:first-child){ display:none; } window.onload = function(){ var ima翻译 2017-02-11 16:12:03 · 515 阅读 · 0 评论 -
Other_2.利用JQ伸缩变动导航栏宽度的效果。
上一个博文是用JS代码来动态改变导航栏的宽度,但是BUG也同时存在,这次我们就用JQ来写。JQ代码写的好处是导航栏在伸缩的时候更加自然,流畅,并且当用户快速在导航栏之间切换的时候,不会出现文字变成竖型排列。当然,使用JQ代码的时候,需要提前在网上下载一个JQ库。JQ库网上有很多,这里就不再提供链接了,有需要的朋友自行百度下载。 JQ伸缩变动导航栏效果转载 2017-02-08 15:10:10 · 971 阅读 · 0 评论 -
Other_3.仿-慕课网课程选项卡_效果1(上下伸缩)
这是我过年在家无聊的时候自己做的一个仿-慕课网课程选项卡,也不知道有没有人会看我的博客,就顺便把代码贴上吧。如果有写得不好的话,也没办法了,水平有限。现在先说第一个效果,上下伸缩。仿-慕课网课程选项卡*{padding: 0;margin:0;list-style: none;text-decoration: none;font-family:Microsoft YaH原创 2017-02-08 15:19:21 · 396 阅读 · 0 评论 -
Other_4.仿-慕课网课程选项卡_效果2(文字变换,图片伸缩)
这是仿-慕课网课程选项卡的第二个效果(文字变换,图片伸缩)。仿-慕课网课程选项卡_效果2 *{padding: 0;margin:0;list-style: none;text-decoration: none;font-family:Microsoft YaHei}.ul2{margin:30px 0 0 50px;width: 800px;height: 200原创 2017-02-08 15:27:12 · 318 阅读 · 0 评论 -
Other_5.表单美化中新的知识点
1、复选按钮id="good"/>for="good">正品保证当使用复选按钮的时候,假如input的 id 等于label的 for ,那么用户在点击“正品保证”四个字的时候,同样也可以把选框打上勾,优化了用户体验。原创 2017-02-08 20:33:42 · 174 阅读 · 0 评论 -
text-align:justify 实现两端对齐文本的效果
W3C 上的解释:justify 可以使文本的两端都对齐在两端对齐文本中,文本行的左右两端都放在父元素的内边界上。然后,调整单词和字母间的间隔,使各行的长度恰好相等为了两端对齐,有些文字的间距就被拉开了。有时候间隔隔得太大会造成阅读困难,所以如果有需要的情况下用letter-spacing收缩字符间距就可以了。另外, text-align-last:right 可以改变段落的最转载 2017-02-18 10:00:16 · 4527 阅读 · 0 评论 -
vertical-align 属性
定义和用法vertical-align 属性设置元素的垂直对齐方式。说明该属性定义行内元素的基线相对于该元素所在行的基线的垂直对齐。允许指定负长度值和百分比值。这会使元素降低而不是升高。在表单元格中,这个属性会设置单元格框中的单元格内容的对齐方式。翻译 2017-02-18 09:43:15 · 191 阅读 · 0 评论 -
inline-block布局
使用inline-block布局相比float的浮动布局,不必担心每个列表高度不一的问题,所以每个列表的内容可以完整显示,这可比直接裁掉要好些。基于display:inline-block的列表布局的优点可以让列表元素不等高。翻译 2017-02-18 10:52:30 · 239 阅读 · 0 评论 -
background-size属性详解
background-size是css3中新增的属性,background-size的cover特定值会保持图像本身的宽高比例,将图片缩放到正好完全覆盖定义背景的区域。background-size: length|percentage|cover|contain;length设置背景图像的高度和宽度。第一个值设置宽度,第二个值设置高度。如果只设置一个值,则第二翻译 2017-02-18 14:41:39 · 992 阅读 · 0 评论 -
JS用户输入框 prompt
prompt() 方法用于显示可提示用户进行输入的对话框。prompt(text,defaultText);text:可选。要在对话框中显示的纯文本(而不是 HTML 格式的文本)。defaultText:可选。默认的输入文本。如果用户单击提示框的取消按钮,则返回 null。如果用户单击确认按钮,则返回输入字段当前显示的文本。在用户点击确定按钮或取消按钮把对话框关闭之前,它将阻原创 2017-02-28 09:59:59 · 3954 阅读 · 0 评论 -
Other_6.利用JQ作出,点击导航栏,所需内容渐入渐变的效果
无意之中,看到一个网站的内容导航效果,所以就想去了解学一下,发现效果挺不错。下面就直接贴出代码,防止遗忘。 点击导航栏,所需内容渐入渐变的效果$(document).ready(function(){$(".btn1").click(function(){$(".text2").fadeOut(1000);$(".text1").fadeIn(100原创 2017-02-10 13:58:31 · 491 阅读 · 0 评论 -
js 字符串 转换成 数字 的方法
var num1 = parseFloat(prompt('请输入第一个数','')); var num2 = parseFloat(prompt('请输入第二个数','')); alert(num1+'*'+num2+'的计算结果是:'+(num1*num2));1. 转换函数:js提供了parseInt()和parseFloat()两个转换函数。前者把值转换成整数,后者把值转载 2017-03-01 11:24:15 · 2854 阅读 · 0 评论 -
AngularJS四大核心特性
[置顶] AngularJS四大核心特性 <div class="article_manage clearfix"> <div class="article_r"> <span class="link_postdate">2015-03-10 18:50</span> <spa转载 2017-07-23 00:02:20 · 329 阅读 · 0 评论