<?xml version="1.0" encoding="gbk"?>
<rss version="2.0">
  <channel>
    <title>弘帝企业智能建站系统交流平台-芜湖万网信息技术服务中心 - 网页制作</title>
    <link>http://www.wh.ac.cn/forum.php?mod=forumdisplay&amp;fid=74</link>
    <description>Latest 20 threads of 网页制作</description>
    <copyright>Copyright(C) 弘帝企业智能建站系统交流平台-芜湖万网信息技术服务中心</copyright>
    <generator>Discuz! Board by Comsenz Inc.</generator>
    <lastBuildDate>Wed, 20 May 2026 23:10:42 +0000</lastBuildDate>
    <ttl>60</ttl>
    <image>
      <url>http://www.wh.ac.cn/static/image/common/logo_88_31.gif</url>
      <title>弘帝企业智能建站系统交流平台-芜湖万网信息技术服务中心</title>
      <link>http://www.wh.ac.cn/</link>
    </image>
    <item>
      <title>NET7中Razor自带的的OPEN-ICONIC图标示例</title>
      <link>http://www.wh.ac.cn/forum.php?mod=viewthread&amp;tid=3132</link>
      <description><![CDATA[开发NET7的Razor代码时，经常会用到图标。
NET7自带了OPEN-ICONIC图标，但我们无法获知有哪些图标名称和展现视觉，我们为大家找到了一个相关网址，方便查览。
https://www.appstudio.dev/app/OpenIconic.html]]></description>
      <category>网页制作</category>
      <author>admin</author>
      <pubDate>Wed, 11 Oct 2023 01:28:18 +0000</pubDate>
    </item>
    <item>
      <title>【CSS3】剪贴路径（Clip-path）在线生成器</title>
      <link>http://www.wh.ac.cn/forum.php?mod=viewthread&amp;tid=3114</link>
      <description><![CDATA[https://techbrood.com/tool?p=css-clip-path]]></description>
      <category>网页制作</category>
      <author>admin</author>
      <pubDate>Thu, 03 Aug 2023 11:42:43 +0000</pubDate>
    </item>
    <item>
      <title>【CSS】图片object-fit居中</title>
      <link>http://www.wh.ac.cn/forum.php?mod=viewthread&amp;tid=3077</link>
      <description><![CDATA[img {
    width:100%;
    height:100%;
    object-fit: cover;
    //object-position: center;
}]]></description>
      <category>网页制作</category>
      <author>admin</author>
      <pubDate>Sun, 04 Sep 2022 15:35:33 +0000</pubDate>
    </item>
    <item>
      <title>长宽比（Ratio）</title>
      <link>http://www.wh.ac.cn/forum.php?mod=viewthread&amp;tid=3076</link>
      <description><![CDATA[https://getbootstrap.com/docs/5.2/helpers/ratio/
https://www.bootstrap.cn/doc/read/157.html


  1x1


  4x3


  16x9


  21x9]]></description>
      <category>网页制作</category>
      <author>admin</author>
      <pubDate>Sat, 03 Sep 2022 09:57:15 +0000</pubDate>
    </item>
    <item>
      <title>文字过长隐藏后用鼠标移动及滚动效果代码</title>
      <link>http://www.wh.ac.cn/forum.php?mod=viewthread&amp;tid=3074</link>
      <description><![CDATA[1、用鼠标滚轴代替移动代码，这里的.Subject有overflow:hidden
let box = document.querySelector(\&quot;.search .Subject\&quot;);
box.addEventListener(\&quot;mousewheel\&quot;, function (event) {
    // -event.wheelDelta / 2 代表幅度(速度),2可以更改
    let v = -event.wheelD ...]]></description>
      <category>网页制作</category>
      <author>admin</author>
      <pubDate>Fri, 02 Sep 2022 13:13:52 +0000</pubDate>
    </item>
    <item>
      <title>鼠标HOVER图片动画特效大全</title>
      <link>http://www.wh.ac.cn/forum.php?mod=viewthread&amp;tid=3072</link>
      <description><![CDATA[https://doc.wqdian.com/hover
https://animate.style/]]></description>
      <category>网页制作</category>
      <author>admin</author>
      <pubDate>Thu, 01 Sep 2022 14:08:42 +0000</pubDate>
    </item>
    <item>
      <title>CSS布局之div交叉排布与底部对齐</title>
      <link>http://www.wh.ac.cn/forum.php?mod=viewthread&amp;tid=3018</link>
      <description><![CDATA[不错的思路：
1、第一种是用bootstrap的row、col-md配合col-md-push、col-md-pull来实现。
2、第二种用flex布局中的flex-direction: row-reverse来实现。
摘自：https://wenku.baidu.com/view/fda ... fb770bf78a3b00.html]]></description>
      <category>网页制作</category>
      <author>admin</author>
      <pubDate>Thu, 09 Jun 2022 07:58:06 +0000</pubDate>
    </item>
    <item>
      <title>【Carousel】轮播设计关于文字垂直居中的问题解决</title>
      <link>http://www.wh.ac.cn/forum.php?mod=viewthread&amp;tid=3010</link>
      <description><![CDATA[这里指的轮播是Bootstrap4标准规范。
.carousel-caption {
        top: 50%;
        transform: translateY(-50%);
        text-align: center;
        bottom:auto;         //这个很重要
}]]></description>
      <category>网页制作</category>
      <author>admin</author>
      <pubDate>Thu, 19 May 2022 02:51:09 +0000</pubDate>
    </item>
    <item>
      <title>【CSS】当大于第几个DOM的样式设计</title>
      <link>http://www.wh.ac.cn/forum.php?mod=viewthread&amp;tid=2986</link>
      <description><![CDATA[.rows {
&amp;:nth-child(6)~.rows {
width: 25%;
}
这儿的意思是.rows第6个以后的.rows的宽度为25%。
p~ul        选择p元素之后的每一个ul元素

CSS 选择器：CSS 选择器 | 菜鸟教程 (runoob.com)]]></description>
      <category>网页制作</category>
      <author>admin</author>
      <pubDate>Fri, 25 Mar 2022 07:43:55 +0000</pubDate>
    </item>
    <item>
      <title>【CSS】解决flex布局时子元素height属性失效</title>
      <link>http://www.wh.ac.cn/forum.php?mod=viewthread&amp;tid=2975</link>
      <description><![CDATA[对于设置了父元素为flex布局的子元素而言，如果没有设置flex-shrink，那么子元素可能会被它的兄弟元素所挤压，是的子元素的高度失效。
父盒子，设置了flex属性表示它是一个flex容器。内部装了三个子盒子，均设置了高度，下面则是多个列表项。
如果列表项的数目足够多 ...]]></description>
      <category>网页制作</category>
      <author>admin</author>
      <pubDate>Wed, 02 Mar 2022 14:39:51 +0000</pubDate>
    </item>
    <item>
      <title>【CSS】缩小图片后，图片变模糊的解决办法</title>
      <link>http://www.wh.ac.cn/forum.php?mod=viewthread&amp;tid=2974</link>
      <description><![CDATA[img {    [/backcolor]image-rendering: -moz-crisp-edges; /* Firefox */     
image-rendering: -o-crisp-edges; /* Opera */      
image-rendering: -webkit-optimize-contrast; /*Webkit (non-standard naming) */ [/backcolor]image-rendering: crisp-edges; 
 ...]]></description>
      <category>网页制作</category>
      <author>admin</author>
      <pubDate>Tue, 01 Mar 2022 03:26:42 +0000</pubDate>
    </item>
    <item>
      <title>【CSS3】不同分辨率设备响应对应的图片</title>
      <link>http://www.wh.ac.cn/forum.php?mod=viewthread&amp;tid=2971</link>
      <description><![CDATA[当设备分别对640以上或以下的分辨率自动响应指定分辨率的图片，不需要JS和CSS即可实现，非常方便。
此功能已经应用于弘帝建站系统。]]></description>
      <category>网页制作</category>
      <author>admin</author>
      <pubDate>Fri, 18 Feb 2022 13:56:31 +0000</pubDate>
    </item>
    <item>
      <title>【CSS3】文字颜色渐变实现</title>
      <link>http://www.wh.ac.cn/forum.php?mod=viewthread&amp;tid=2966</link>
      <description><![CDATA[background-image: -webkit-gradient(linear, left 0, right 0, from($fst), to($sec));
-webkit-background-clip: text; /*必需加前缀 -webkit- 才支持这个text值 */
-webkit-text-fill-color: transparent;

本文在弘帝模板220119中应用]]></description>
      <category>网页制作</category>
      <author>admin</author>
      <pubDate>Fri, 21 Jan 2022 05:14:17 +0000</pubDate>
    </item>
    <item>
      <title>positon:absolute未知宽度DIV水平居中的办法</title>
      <link>http://www.wh.ac.cn/forum.php?mod=viewthread&amp;tid=2950</link>
      <description><![CDATA[div有宽度的比较好做，有多种办法，比如：方法一：left:-50%;margin-left:-50%的指定宽度
方法二：bottom:0; left:0; right:0;margin:0 auto;

但实际很多盒子构建是未知宽度，如果没有指定宽度，曾经很难找到方法，经过不断寻找方法和测试，以下方法比较好用
首先 ...]]></description>
      <category>网页制作</category>
      <author>admin</author>
      <pubDate>Fri, 26 Nov 2021 11:12:55 +0000</pubDate>
    </item>
    <item>
      <title>背景图片如何渲染颜色与透明度</title>
      <link>http://www.wh.ac.cn/forum.php?mod=viewthread&amp;tid=2945</link>
      <description><![CDATA[渐变色：
background-image: linear-gradient(rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.1)), url(../img/glow.jpg);

变黑底：
background-image: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url(../img/glow.jpg);

变白底：
background-image: li ...]]></description>
      <category>网页制作</category>
      <author>admin</author>
      <pubDate>Fri, 12 Nov 2021 10:54:10 +0000</pubDate>
    </item>
    <item>
      <title>INPUT FILE上传文件时指定文件类型</title>
      <link>http://www.wh.ac.cn/forum.php?mod=viewthread&amp;tid=2942</link>
      <description><![CDATA[1.accept=\&quot;application/msexcel\&quot;
2.accept=\&quot;application/msword\&quot;
3.accept=\&quot;application/pdf\&quot;
4.accept=\&quot;application/poscript\&quot;
5.accept=\&quot;application/rtf\&quot;
6.accept=\&quot;application/x-zip-compressed\&quot;
7.accept=\&quot;audio/basic\&quot;
8.accept=\&quot;audio/x-aiff\]]></description>
      <category>网页制作</category>
      <author>admin</author>
      <pubDate>Wed, 08 Sep 2021 02:03:59 +0000</pubDate>
    </item>
    <item>
      <title>Animate.css 一款强大的预设css3动画库</title>
      <link>http://www.wh.ac.cn/forum.php?mod=viewthread&amp;tid=2939</link>
      <description><![CDATA[特效：https://www.jq22.com/yanshi819
特效：https://animate.style/

使用方法：
img:hover {
     animation: pulse;
     animation-duration: 1s;
}]]></description>
      <category>网页制作</category>
      <author>admin</author>
      <pubDate>Mon, 09 Aug 2021 14:59:04 +0000</pubDate>
    </item>
    <item>
      <title>【HTML】HTML &lt;slot&gt; 元素</title>
      <link>http://www.wh.ac.cn/forum.php?mod=viewthread&amp;tid=2891</link>
      <description><![CDATA[摘自：https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/slot
HTML  元素 ，作为 Web Components 技术套件的一部分，是Web组件内的一个占位符。该占位符可以在后期使用自己的标记语言填充，这样您就可以创建单独的DOM树，并将它与其它的组件组合在一起。
 ...]]></description>
      <category>网页制作</category>
      <author>admin</author>
      <pubDate>Sat, 05 Dec 2020 03:44:14 +0000</pubDate>
    </item>
    <item>
      <title>网页自适应手机屏幕的几种方法</title>
      <link>http://www.wh.ac.cn/forum.php?mod=viewthread&amp;tid=2874</link>
      <description><![CDATA[一. 允许网页宽度自动调整

viewport是网页默认的宽度和高度，上面这行代码的意思是，网页宽度默认等于屏幕宽度（width=device-width），原始缩放比例（initial-scale=1）为1.0，即网页初始大小占屏幕面积的100%。

二. 不使用绝对宽度 由于网页会根据屏幕宽度调整 ...]]></description>
      <category>网页制作</category>
      <author>admin</author>
      <pubDate>Tue, 17 Nov 2020 15:11:59 +0000</pubDate>
    </item>
    <item>
      <title>滚动条的美化设计参数详解</title>
      <link>http://www.wh.ac.cn/forum.php?mod=viewthread&amp;tid=2847</link>
      <description><![CDATA[::-webkit-scrollbar {
        width: 15px;
} /* 这是针对缺省样式 (必须的) */

::-webkit-scrollbar-track {
        background-color: #b46868;
}
/* 滚动条的滑轨背景颜色 */

::-webkit-scrollbar-thumb {
        background-color: rgba(0, 0, 0, 0 ...]]></description>
      <category>网页制作</category>
      <author>admin</author>
      <pubDate>Fri, 23 Oct 2020 02:54:07 +0000</pubDate>
    </item>
  </channel>
</rss>