建站教程 第3页

老蒋 发布于 2024-08-03 09:15:41

我们在设计HTML前端代码的时候现在较多用的是HTML5，虽然有些时候不遵守代码规范也是不影响用户体验，但是严格意义将代码是需要规范的。在设计布局元素的时候，我们是不是会看到header、nav、article、aside、section、footer 这些元素标签，这些元素标签...

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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