-
![[前端美化]为B2主题首页增加一个公众号与网站统计区块！](https://www.weimahe.com/wp-content/themes/b2/Assets/fontend/images/default-img.jpg)
[前端美化]为B2主题首页增加一个公众号与网站统计区块！
小编今天无聊逛了逛B2主题的售后群，发现一枚大佬，这位大佬专门分享各种Wordpress主题以及好看的前端样式。 今天这篇文章就是基于这位大佬创作的，微码盒小编只是在原基础上稍微改动了一些。 预览 下面小编将这个代码展示出来，对于B2主题用户来说，使用非常简单。 只需要在主题设置-首页模块-新增一个HTML模板，位置可以自由选择。 HTML代码 <div class="join-u…...- 0
- 0
- 749
-
网站侧边添加梅花飘落特效
给网站左右两侧添加梅花飘落特效，花瓣从空中飘落，想雪花一样非常漂亮，刚开始耍博客的时候，比较热衷于这些，其实就是给网站加上一些特效，稍微的美化下带来一点异样的感觉，如果看起来感觉还可以，并且有兴趣的话，那我们继续看下怎么操作： 步骤一 首先，在 body 中，添加一个 div，来放置梅花树枝的图片 <div id="meihua"></div> 步骤二 …...- 0
- 0
- 92
-
jQuery 直接读取网站数据库数据并做判断的方法
我们在网站开发过程中，我们有时需要直接从数据库里读取数据，并且将数据进行相关的判断。我们读取数据库的常用方法就是直接使用 PHP 来读取。 今天给大家介绍一下使用 JQUEYR 直接读取网站数据库数据并做判断的方法。通过 JQEURY 从数据库中拿数据，并且根据自己的需要进行判断得到相关的结果。 JQUEYR 直接读取网站数据库需要以下几个步骤，首先是 JS 文件，在 JS 文件中，使用 AJAX…...- 0
- 0
- 13
-
通过CSS代码自定义站点滚动条样式
平时我们看多了浏览器默认的滚动条也会腻的，所以偶尔改变一下滚动条的样式及颜色也是一种不错的选择。下面跟大家简单介绍一下如何通过 CSS 代码来自定义自己站点上的滚动条样式。此方法使用 CSS 来设置滚动条的样式，这比使用 jQuery 更快。但是，它仅适用于使用 Google Chrome，Safari，Opera 等 WebKit 渲染引擎的桌面浏览器。它对桌面计算机上的移动浏览器或 Firef…...- 0
- 0
- 29
-
CSS 中 background 属性合并写法
上次写 CSS 样式时同时有 background-size background-positon 两个属性，但是我想合并成一个 background 来写，刚开始遇到了一些麻烦，怎么写都不生效。后面谷歌，我们应该这样子写： background：no-repeat scroll 0px 0px / 200px 29px rgba(0, 0, 0, 0); / 做分割 前面是 background…...- 0
- 0
- 22
-
自适应网页怎么做？自适应网页制作方法
自适应网页是指网页根据用户浏览设备的头信息，自动变换网页的 CSS 参数，达到网不同浏览设置显示不同的网页版面的效果。自适应网页的原因就是使用 CSS3 中的@media 属性来判断变换的。在实际网页制作过程中，我们怎么制作自适应网页呢？下面介绍一下自适应网页制作方法。 第一步：在网页头信息中添加 meta 参数； <meta content="width=device-width…...- 0
- 0
- 17
-
响应式网页中如何插入响应式图片
现下流行的网页基本都是基于响应式布局设计（responsive web design）的，本文讲解在响应式布局的网页中如何正确的插入图片使其能自适应屏幕大小，同时还能获得最佳的加载性能与显示效果，这种方式叫做”响应式图片”（responsive image）。 响应式图片的解决方案有很多，HTML、JavaScript 和 CSS 都可以实现，本文介绍 HTML 与 CSS 两种方式，因为实现最简…...- 0
- 0
- 54
-
jQuery 鼠标滑过链接图片滑动展开与隐藏效果
这篇文章主要介绍了 jQuery 实现鼠标滑过链接控制图片的滑动展开与隐藏效果，涉及 jQuery 鼠标事件的响应及链式操作的相关技巧，具有一定参考借鉴价值，需要的朋友可以参考下。 这里演示 jQuery 实现鼠标移动到链接上，滑动展开/隐藏图片效果，鼠标放在“上一页”“下一页”上，立即浮现出所对应的图片，有点提前预览的味道，让用户知道下一页或下一页的大致内容，很好的提升了用户体验。运行效果截图如…...- 0
- 0
- 9
-
jQuery 监听 textarea 文本段数据行数方法
在做网站时，少不了一些表单，在前面的教程中，我们介绍了怎么给表单 textarea 文本域添加行号。如果在表单里如果我们想限制用户的输入数据的行数，可以通过 JQUERY 代码来实现监听。以下是 jquery 监听 textarea 数据行数方法： $("#textarea").val().split("\n").length 通过这个监听的数据，我们也可以…...- 0
- 0
- 11
-
CSS样式表中样式覆盖优先顺序
有时候在写 CSS 的过程中，某些限制总是不起作用，这就涉及了 CSS 样式覆盖的问题，如下： #navigator { height: 100%; width: 200; position: absolute; left: 0; border: solid 2 #EEE; } .current_block { border: solid 2 #AE0; } 查找一些教材中（w3schools 等…...- 0
- 0
- 17
-
CSS 文字加粗不影响整体宽度
在写 Tab 组件时（每一项的数据都从后台获取，width 宽度不定，使用 padding 隔开），下划线时通过计算每一项的宽度实现滑动效果，字体加粗标记当前项，且当鼠标 hover 时，对应项的字体也加粗，此时由于字体加导致粗宽度变化了，所以滑块位置也偏移了，想到用鼠标的 mouseenter 和 mouseleave 重新计算宽度，但是比较麻烦，有没有好的方法处理，使字体加粗不影响宽度的改变？…...- 0
- 0
- 159
-
文章标题链接平滑右移效果代码
在很多的博客上看到了，鼠标过去，文章列表标题抖动右移的效果。感觉挺炫的。我试了一下。在我的博客主题上感觉不太适合，所以没有继续用。不过先收着吧，以后需要的时候也可以继续用。大家可以试试！ 方法一： 优点：兼容所有浏览器，包括 IE 什么的。 缺点：代码也很短，没什么缺点。 jQuery(document).ready(function($){ $('.entry-title a'…...- 0
- 0
- 41
-
JS实现点击弹出层再点击任意位置隐藏弹出层
我们经常使用到弹出层。对于弹出层，原本的意义就是增加与用户的交互，提升用户的好感度。我们在使用的时候需要注意几个弹出层的注意点： 弹出层的界面需要统一，不一致的弹出层并不能增加美感，相反还会显得页面布局更加杂乱无章； 弹出层的设计一定要好看，按钮要符合项目的主色调； 弹出层的宽度固定屏幕占比，设置 max-width，高度根据内容自适应； 点击其他区域能隐藏弹出层。 今天，主要说说点击其他区域隐藏…...- 0
- 0
- 35
-
CSS3 文字边框 -webkit-text-stroke 镂空的字体
其实一直没用过这个属性，发现还可以有很不错的效果，就二行代码就搞掂，分享下 CSS 边框的一个不足就是只有矩形的元素才能使用。-webkit-text-stroke 可以为文字添加边框。它不但可以设置文字边框的宽度，也能设置其颜色。而且，配合使用 color: transparent 属性，还可以创建镂空的字体！ 代码如下： h3 { color: transparent; -webkit-tex…...- 0
- 0
- 28
-
[前端学习]CSS 设置文字只显示一行，多余显示省略号
一般在我们写网站前端时，文章标题和文章描述为了好看和排列整齐经常需要用到这个功能。 显示一行 .text1{ display: inline-block; //设置inline-block属相 white-space: nowrap;//强制不换行 width: 100%; overflow: hidden;//隐藏超出部分 text-overflow:ellipsis;//显示“&h…...- 0
- 0
- 579
-
常见CSS五种隐藏元素方式
今天微码盒分析下 CSS 隐藏元素，通常小伙伴们都会想到的一种方法就是设置 display:none，这是也是最为人所熟知并且是最常用的方法。 当然我也相信还有不少人想到使用设置 visibility:hidden 来隐藏元素，这种方式也是常用的方法，而且也有很多人知道两者的不同。 除了这两种方法，本文总结了四种 css 隐藏元素方式，具有一定的参考价值，比较了这几种“隐藏”元素方法的区别和优缺点…...- 0
- 0
- 81
-
HTML5 网页上下翻页时钟效果代码
因为博客首页有个 Flash 的时钟，对于大多数浏览器 Flash 是没有问题的，而 Firefox 等就稍微有些麻烦了，而且 IOS 系统是 Flash 的死对头。很早之前就想着上个 HTML5 的时钟来替代这个 Flash，今天从一个网站弄了点源码，修改了下，总算完工了。 PS：185 行的 urlSize 为显示的宽度，高度自动适应。 <html> <head><…...- 0
- 0
- 24
-
给菜单中UL下的某一个或某几个LI添加自定义类
我们有时候在定制 WORDPRESS 主题的时候，由于菜单样式的要求我们需要给我们的 WordPress 获取到的菜单中的 UL 下的某一个或某几个 LI 添加自定义的类，比如我给客户设置制作的这个主题中，因为 LOGO 在菜单中间显示，所以我需要第四个菜单和第五个菜单的右边和左边流出一定的距离来显示 LOGO，那么这个时候如果我能给第思个菜单和第五个菜单的 LI 分别添加一个自定义类，那么我就可…...- 0
- 0
- 6
-
JavaScript中escape()、encodeURI()、encodeURIComponent()的区别
JavaScript 中有三个可以对字符串编码的函数，分别是： escape,encodeURI,encodeURIComponent，相应 3 个解码函数：unescape,decodeURI,decodeURIComponent 。 下面简单介绍一下它们的区别 1 escape()函数 定义和用法 escape() 函数可对字符串进行编码，这样就可以在所有的计算机上读取该字符串。 语法 esc…...- 0
- 0
- 21
-
除了最后一个元素之外其他元素之间添加分隔符
除了最后一个元素之外其他元素之间添加分隔符，您可以使用标准的 CSS 来做到这一点： li:after { content: ','; } li:last-of-type:after { content: ''; } 我更喜欢单独的规则，但如果稍微少一个更简洁： li:not(:last-of-type�…...- 0
- 0
- 26
-
纯CSS制作中英文双语导航菜单
网站模板开发过程中，时常有客户需要把菜单做成中英文效果，当鼠标悬浮时切换语言，今天创客云分享一款你一定喜欢的 CSS 中英文双语菜单教程，此教程支持鼠标悬浮特效，您可以先运行一下看效果，绝对会另你满意。用到了一个背景图片，请自行下载。 代码如下： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "…...- 0
- 0
- 30
-
两行CSS代码实现最简单瀑布流实现方式
昨天无聊写了个随机一套图的小程序接口，在写 HTML 的时候遇到了让人难受的 css，百度后找到一位大神提供的办法，以后图片瀑布流都是垃圾，两行代码就够了！感觉自己膨胀了哈，下面一起来看看效果。 代码很简单，只需要给包裹所有图片的元素设置一个 CSS 样式，然后给包裹一张图片的元素设置一个样式即可。比如 <ul> <li><a href="xxxx"…...- 0
- 0
- 12
-
WordPress 为媒体添加自定义字段
WordPress 中，我们可以很轻松的使用插件或者写代码为文章或页面添加自定义字段。可能是因为使用的场景不多，支持为媒体添加自定义字段的插件和教程确很少。 在这篇文章中，我们一起来看一下怎么为 WordPress 媒体添加自定义字段。实现代码其实很简单，也完全没必要用插件来实现。最终实现的效果如下图所见。 首先，为媒体添加自定义字段表单 在下面的代码中，我们使用 attachment_field…...- 0
- 0
- 38
-
CSS3判断横屏竖屏方式（三种）
很多时候，为了让手机版横竖屏时有一个理想的效果，我们都需要通过判断区间来设定相应的 css 样式，现在的 CSS3 推出了一个可以判断手机横竖屏的媒体查询。在做移动端页面的时候经常会遇到需要判断横屏还是竖屏，下面将目前已知的通过 HTML，CSS，JS 三种判断方法记录下来，方便以后翻阅。 1、通过在 html 中分别引用横屏和竖屏的样式： <link rel="styleshee…...- 0
- 0
- 24
-
￥优惠劵使用时效：无法使用使用时效：
之前
使用时效：永久有效优惠劵ID：×