
web前端
青茶360
再苦在累也要坚强 只为那些期待眼神
展开
-
网页嵌套iframe标签,点击左侧导航菜单,在右侧动态显示页面
功能描述:在后台开发的时候往往遇到这种功能,点击左侧的导航菜单,在右侧动态iframe显示页面内容,知识点:iframe名称:iframe嵌套解决方案2种: 1.js解决 2.a标签target属性解决方案一:js方案<!--主体内容部分--><div class="main"> <!-- 左侧导航 --> <div class="main_left"> <div cla...原创 2022-03-06 15:05:03 · 10461 阅读 · 11 评论 -
网页设计_导航条_下拉菜单
导航条下拉菜单效果1.导航条下拉html代码:<!-- 新导航条 --> <div class="tnav"> <div class="tnav_c"> <ul> <li><a href="#">首页</a></li> <li><a h原创 2022-02-24 09:05:08 · 3123 阅读 · 0 评论 -
网页通过iframe嵌入百度地图API时自适应屏幕
1、iframe标签按照常规响应式的样式写就可以了,比如:<style type="text/css">iframe{width:100%;min-height:471px}@media screen and (max-width: 640px) { #iframe{min-height:271px}}@media screen and (min-width:750px) and (max-width:800px){ #iframe{min-height:271px}}&l原创 2021-03-18 10:36:49 · 1268 阅读 · 0 评论 -
js秒杀倒计时
<html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> ul{ background: aqua; } li{ display: inline-bl.原创 2020-09-11 17:55:49 · 243 阅读 · 0 评论 -
封装GetQueryString()方法来获取URL的value值
首先测试URL:http://192.168.1.82:8020/juzhong/daojishi.html?name=xiangruding&sex=nuuu&age=90代码如下:(说明:获取的是当前页面的URL;这里测试需要在后边自己手动添加 ?name=xiangruding&sex=nuuu&age=90);<body> <script type="text/javascript"> .原创 2020-09-10 16:58:37 · 401 阅读 · 0 评论 -
.clearfix:after(清除浮动)中各个属性及值详细解说
.clearfix:after { <----在类名为“clearfix”的元素内最后面加入内容;content: "."; <----内容为“.”就是一个英文的句号而已。也可以不写。display: block; <----加入的这个元素转换为块级元素。clear: both; <----清除左右两边浮动。visibility: hidden; <----可见度设为隐藏。注意它和display:none;是有区别的。visibility:hidden;仍然占据空间,.原创 2020-09-07 08:53:37 · 2102 阅读 · 1 评论 -
网站优化提高加载速度的14个技巧
优化了加载速度的网站不仅可以提高其搜索引擎的排名,同时也可以降低网站的跳出率,提高其转换率,还能提供更好的终端用户体验,这是当今基于Web环境取得成功的关键。下面我将介绍几个优化网站加载网页速度的简单方法,一起来看一下。1.服务器响应时间即使网站已经格外优化,但是除非服务器响应时间非常快,否则就不会有什么大的效果。当涉及到提高网站的速度,服务器响应时间起着重要的作用。下面是一些提高...转载 2020-03-23 11:22:08 · 431 阅读 · 0 评论 -
帝国cms提高网站网页打开速度的方法
1、减少页面HTTP请求数量 2、使用CDN(Content Delivery Network)网络加速 3、添加文件过期或缓存头 4、服务器开启gzip压缩 5、css格式定义放置在文件头部 6、Javascript脚本放在文件末尾 7、避免使用CSS脚本(CSS Expressions) 8、css、javascript改由外部调用 9、压缩Javascript...原创 2019-11-06 08:09:26 · 832 阅读 · 0 评论 -
你不知道的DIV+CSS的命名规则
搜索引擎优化(seo)有很多工作要做,其中对代码的优化是一个很关键的步骤。为了更加符合SEO的规范,下面是目前比较好的CSS+DIV的命名规则1DIV CLASS或者ID页头:header登录条:loginBar标志:logo侧栏:sideBar广告:banner导航:nav子导航:subNav菜单:menu子菜单:subMenu搜索:...原创 2019-11-02 14:51:04 · 229 阅读 · 0 评论 -
网页自适应rem如何适配_rem详解及使用方法
作为一个前端开发人员,我们的任务是将UI设计师的图稿运用计算机语言呈现在用户面前。而现在的设备大小尺寸不一,近年来智能手机的普及更是让网页的用户大部分来源与手机,所以让不同大小的移动端屏幕都能较好的还原设计稿就成了一个前端开发者需要解决的当务之急。我查阅了大量资料和进行了一些实践,下面是我对移动端适配的一些认识。首先我们来谈谈我们在电脑端用的字体单位px和em在国内的网站中大多都是使用...原创 2019-06-30 20:28:06 · 8286 阅读 · 1 评论 -
100多个基础常用JS函数和语法集合大全
网站特效离不开脚本,javascript是最常用的脚本语言,我们归纳一下常用的基础函数和语法:1.输出语句:document.write(""); 2.JS中的注释为//3.传统的HTML文档顺序是:document->html->(head,body)4.一个浏览器窗口中的DOM顺序是:window->(navigator,screen,history,locatio...原创 2018-11-14 16:29:42 · 278 阅读 · 0 评论 -
25条div+CSS编程提醒及小技巧整理大全
1、ul标签在Mozilla中默认是有padding值的,而在IE中只有margin有值。2、同一个的class选择符可以在一个文档中重复出现,而id选择符却只能出现一次;对一个标签同时使用class和id进行CSS定义,如果定义有重复,id选择符做的定义有效,是因为ID的权值要比CLASS大。3、一个兼容性调整(IE和Mozilla)的笨办法: 初学可能会碰到这样一个情况:同样一个标签的...原创 2018-11-14 16:25:41 · 279 阅读 · 0 评论 -
原创简单php框架源码
原创简单php框架源码原创 2015-12-18 19:34:01 · 1103 阅读 · 0 评论 -
如何让网页自适应所有屏幕宽度
随着网络的快熟发展,越来越多的人使用手机上网。移动设备正超过桌面设备,成为访问互联网的最常见终端。于是,网页设计师不得不面对一个难题:如何才能在不同大小的设备上呈现同样的网页?手机的屏幕比较小,宽度通常在600像素以下;PC的屏幕宽度,一般都在1000像素以上,有的还达到了2000像素。同样的内容,要在大小迥异的屏幕上,都呈现出满意的效果,并不是一件容易的事。很多网站的做法是对不同终端设计多个网页原创 2017-03-03 15:18:04 · 91722 阅读 · 4 评论 -
网页设计制作必须知道的10个秘诀
要制作一个网页,或由若干页面组成的网站,而要做一个有吸引力的,如长青树般的网站请看本文:网页设计制作必须知道的10个秘诀1.4秒的时间(我们在设计首页时尽可能的简化,并加速打开网站的速度。) 在整个internet中日均页面访问只有4秒。这就意味着你没有足够的时间来让浏览者加深对网站的印象和互动。你要尽可能精确的来说明你这个网站最主要的功能是什么。如果一个网站打开的时间超过了原创 2017-03-03 16:01:20 · 681 阅读 · 0 评论 -
彻底弄懂css中单位px和em,rem的区别
PX:PX实际上就是像素,用PX设置字体大小时,比较稳定和精确。但是这种方法存在一个问题,当用户在浏览器中浏览我们制作的Web页面时,如果改变了浏览器的缩放,这时会使用我们的Web页面布局被打破。这样对于那些关心自己网站可用性的用户来说,就是一个大问题了。因此,这时就提出了使用“em”来定义Web页面的字体。EM:EM就是根据基准来缩放字体的大小。EM实质是一个相对值,而非具体原创 2017-03-12 10:06:43 · 409 阅读 · 0 评论 -
Win10专业版下图片拖到PS无法打开的解决技巧
PS这个软件是用户最常用的软件之一,其强大的图形处理能力毋庸置疑。有用户表示在Win10专业版系统中使用PS发现图片不能直接拖动到PS中打开,这个问题本身不是特别大的问题,但这一小小的毛病会打破用户习惯,影响工作效率,阅读下文了解Win10专业版下PS不能拖拽打开的解决办法。第一步、按win+r打开运行窗口,输入regedit,回车打开注册表编辑器,如图所示:第二步、依次打原创 2017-04-07 10:51:03 · 5424 阅读 · 0 评论 -
xml学习_上篇
xml简介:XML 指可扩展标记语言(eXtensible Markup Language)。XML 被设计用来传输和存储数据。xml小示例:/*******************************************/ToveJaniReminderDon't fo原创 2017-04-02 14:13:01 · 599 阅读 · 0 评论 -
手机端rem如何适配_rem详解及网页自适应
什么是rem在我看来,rem就是1rem单位就等于html节点fontsize的像素值。所以改变html节点的fontsize是最为关键的一步。根据手机宽度改变相对大小就可以实现自适应了,就不用什么媒体查询那些的。我们的设计图往往宽度是640或者其他尺寸的,不过我建议是用这个尺寸,以640为基准,以小到大,实现自适应,下面实现的比例为1rem=40px(640宽度)。为什么原创 2017-05-13 09:07:25 · 7568 阅读 · 0 评论 -
JavaScript学习历程和心得体验
一、前言在过去,JavaScript只是被用来做一些简单的网页效果,比如表单验证、浮动广告等,所以那时候JavaScript并没有受到重视。自从AJAX开始流行后,人们发现利用JavaScript可以给用户带来更好的体验,甚至利用这一优点开发了大型网页游戏,于是这门小语言被重视了起来。现在,很多公司会招专门的JavaScript工程师,通常JavaScript是WEB前端开发的必备技能原创 2017-05-05 08:20:42 · 1668 阅读 · 0 评论 -
禁止右键,禁止选中,禁止网页复制的Js代码
document.oncontextmenu=new Function('event.returnValue=false;');document.onselectstart=new Function('event.returnValue=false;');以上两断代码即可搞定!原创 2017-06-09 18:54:52 · 523 阅读 · 0 评论 -
JS开发者常用的10个Sublime Text插件
Sublime Text 是每个开发者工具箱中都应该有的一个强大的应用。它是一个跨平台的、高定制化的、高级的文本编辑器,在功能强大的 集成开发环境(众所周知地消耗资源)和类似于 Vim 或 Emacs 的命令行编辑器(学习成本非常高)之间取得了很好的平衡。原创 2015-11-26 00:12:57 · 960 阅读 · 0 评论