- 博客(7)
- 问答 (1)
- 收藏
- 关注
原创 利用JS为女朋友做一个小工具
最近学到了JS的document对象的属性和方法,利用现有的知识做一个简易的网页小工具。先上效果图:每次学前端的时候查资料也花挺多时间,所以做一个方便自己的网页小工具,放在桌面,用到的是onclick点击事件,和提交表单的一点知识,提交表单给百度。和button的点击转到新地址。大致的效果就是:搜索,切换翻译,和转到需要的网页。实现方法:1.利用html的各个表单设计基本的样式<l...
2020-04-13 22:49:32
2096
3
原创 记录CSSmargin的合并与塌陷,及CSS精灵图
1.margin的合并在实际操作中会发现,两个相邻的块级元素如果都设置外边距会发现大的margin会覆盖小的margin在有时候我们进行网页设计的时候并不想要这种效果。解决的方案如下:(1)将margin改为padding(2)用position定位(3)将块级元素变为行内元素inline-block2.块级元素的塌陷当一个外层div包含一个内层div时,给内层div设置mar...
2020-03-28 22:03:46
195
原创 CSS圣杯布局与双飞翼布局
记录一下新学的CSS圣杯布局有些时候我们需要随着浏览器的窗口缩小,侧边栏不会改变,主体内容自适应,就会用到圣杯布局。基本的思想;将主体和侧边栏放在一个div下给这个div设置时用padding留下侧边栏的模块。将主体部分设置宽度自适应。再用margin-left属性和relative属性定位侧边栏。先来看看效果图:具体操作如下:1.先设置整体框架<div id="contai...
2020-03-26 00:04:02
305
原创 Sublime与Firefox(火狐)配置livereload插件实现动态实时刷新浏览器
我们在使用sublime时一般需要修改html代码时要保存退出然后刷新浏览器,这样就显得有点麻烦。火狐浏览器和sublime都提供了livereload插件,网络上大部分都是说配置Chrome,火狐的配置很少,不过其实也差不多的步骤。火狐配置比谷歌简单一点。下面我来介绍一下具体步骤:1.首先确定你的sublim是否安装了Package Control,如果没有安装,你需要为sublime t...
2020-03-23 10:05:14
2240
4
原创 CSS关于position布局覆盖及解决方案
先来介绍一下pastion的定位方式1.两个div都没定位<div style="width: 300px;height: 300px;background-color: yellow;"> 第一层 </div><div style="width: 300px;height: 300px; background-color: blue;"> 第二层...
2020-03-14 10:49:25
15125
1
原创 CSS将图片居中显示在背景图上的几种方法(小白自己实践过程)
当我想用一张图作为背景的时候,发现的一些问题:1.在设置一个div时,如果用一张图作为这个div的背景时,会发现,这张图与设置div的大小不一致2.当我没有给背景定义不平铺时background-repeat: no-repeat;这就会使图片显示不完整(超出或者缺失)。加了不平铺的属性后,div中缺失的部分则会由空白填补。此时我们则需要让图片自适应我们的div,加入如下代码backg...
2020-03-12 21:34:50
4936
原创 初学CSS样式让一行显示两行文字及删除线颜色改变的探索(第一次写博客求指点)
突然看到一段这样的样式,也是因为正在学前端,所以突发奇想,想用网页设计也做出这样的效果。在我首先拿到图的时候,想了想最难的地方可能就是如何让两行文字在一行显示。第一个想到的是用定义上下标的形式用<sub>和<sup>定义它的上下标,达到效果。在具体实现的时候发现有一个距离问题然后我用了margin-left:-90px;强行修改(萌新的操作)也算是达到了想要的效...
2020-03-10 14:12:04
1104
空空如也
Vue使用pdf.js报错
2022-07-13
TA创建的收藏夹 TA关注的收藏夹
TA关注的人