建站教程

利用CSS实现图标白色或者黑色样式

老蒋 发布于 2024-07-26 10:31:30

有些时候我们图标默认是黑色或者其他颜色,我们希望不变化图标的颜色的时候直接通过CSS设置黑色或者白色,这里可以用到CSS实现。比如老蒋在这里遇到一个客户,他的通栏图片上有一个小图标原来是黑色的,我希望变成白色。 .black { filter: brightness(0); } ...

记录实现图片不裁剪可以用CSS位置偏移

老蒋 发布于 2024-07-25 23:12:35

我们有些时候喜欢在设计网页的时候头部一个大图背景,但是有些时候图片内有图案默认可能稍微差一点不居中。这里,我们可以用到裁剪图片的方式,但是这样也不够好,裁剪毕竟麻烦,我们可以用CSS实现位移。 transform: translateX(-50px); 类似这样的CSS实现向左移...

记录给网页链接添加快速描点跳转功能

老蒋 发布于 2024-07-24 21:53:16

所谓的描点链接,就是我们点击某个URL链接的时候快速跳转到当前页面的指定位置在当前一屏中。当然这个是最为快捷的方法,如果我们稍微友好一点的话,还可以做成平滑移动的效果。 链接: <a href="#miao">itbulu.com</a> 这里我们给链接加...

利用CSS样式给图片颜色加深滤镜效果

2

老蒋 发布于 2024-07-24 19:19:24

一般我们在设计网站的时候有的风格是通栏的大图,遇到一个客户希望图片颜色加深滤镜的效果。这个效果确实比我们用原图会更加稳重一些。 当然我们可以给图片本身做滤镜效果,但是我们也可以直接用CSS设置。 itbulucom-img { -webkit-filter: brightness...

JS控制导航菜单的位置实现导航吸顶效果

1

老蒋 发布于 2024-07-21 21:50:05

老蒋在前面的多篇文章中都有提到可以用CSS实现控制菜单导航的吸顶效果。在这篇文章中,我们也可以通过用JS代码来判断导航的位置距离顶端浏览器的位置,然后再实现吸顶跟随效果。 1、CSS 代码部分 body { padding:0; margin:0; } #nav { width:...

用CSS样式实现导航栏吸顶效果方法

1

老蒋 发布于 2024-07-20 22:14:14

我们在设计网页的时候,是不是页面较长在拉动页面的时候希望导航在每个版面中都可以吸附在顶部可以看到。这里,我们可以通过用到CSS样式来实现。 具体的样式如下: CSS内容: <style type="text/css"> body { margin: 0; } .hea...

CSS有用的功能实现电脑端显示手机端隐藏

老蒋 发布于 2024-07-20 21:44:51

我们在设计网页的时候,有些特定的内容后续根据客户要求添加的。在调试自适应的时候,电脑端要显示,移动端不显示。这里我们可以直接通过CSS样式定义,超过多大的屏幕后隐藏。 <div class="app-none">电脑端显示的内容</div> 如果我们在某个...

CSS实现文字悬浮在图片中间位置的样式效果

1

老蒋 发布于 2024-07-20 21:39:13

我们在设计网页的时候,是不是有看到文字附着在图片的中间。常规简单的办法就是直接将图片上打上文字,但是这样每次修改就显得麻烦。于是,我们可以尝试用定位的方式将文字部分便宜到图片中间的位置。 最终实现的效果就这样子。 CSS样式部分: .bannertop .site-center-...

CSS固定导航至顶部且浮动透明的方法

老蒋 发布于 2024-07-20 11:19:32

遇到一个客户,原本按照指定的计划模板设计好企业网站的,现在他要求首页顶部样式和他的旧网站一样,BANNER大图置顶且菜单也是透明置顶悬浮。 我们前提是顶部的导航在一个盒子中,可以用样式 tophead 嵌入样式。 .tophead { position: fixed; heigh...

阿里云虚拟主机价格对比整理(不同配置适合不同程序)

1

老蒋 发布于 2024-04-02 11:31:57

阿里云虚拟主机是延续原来的万网主机产品,且在去年底的时候取消共享主机而目前只有独立云虚拟主机。相比共享主机而言,独享虚拟主机拥有独立IP,且资源稳定性比共享主机要好很多。现在阿里云虚拟主机产品相比国内的其他主机产品还是比较丰富的,比如类型的丰富性、机房的丰富性。 在这篇文章中,我...