html 5常见的面试题

1、常见的块级元素  内联元素p -最常用的块级元素     dl - 和dt-dd 搭配使用的块级元素     form - 交互表单     h1 -h6- 大标题     hr - 水平分隔线     ol – 有序列表     p - 段落     ul - 无序列表     fieldset - 表单字段集     colgroup-col - 表单列分组元素     table-tr-td  表格及行-单元格     pre - 格式化文本a –超链接（锚点）     br - 换行     i - 斜体     em - 强调     img - 图片     input - 输入框     label - 表单标签     span - 常用内联容器，定义文本内区块     strong - 粗体强调     sub - 下标     sup - 上标     textarea - 多行文本输入框     u - 下划线     select - 项目选择2、实现文本三个点的几个条件text-overflow属性仅是：当文本溢出时是否显示省略标记，并不具备其它的样式属性定义，要实现溢出时产生省略号的效果还需定义：
1、容器宽度：width：value；（px、%，都可以）
2、强制文本在一行内显示:white-space：nowrap;
3、溢出内容为隐藏：overflow：hidden；
4、溢出文本显示省略号：text-overflow：ellipsis;
注：必须是单行文本才能设置本文溢出！！！

IE6+；chrome1.0+；safari3.1+（firefox,opera暂不支持）

3、垂直居中的几个条件

设置一个元素在一个容器中垂直居中，必须更改默认的display属性值为inline-block;
并加上同级元素（标尺）（同级元素[标尺]样式设置为vertical-align:middle;width:0;height:100%;display:inline-block;） 。

三个条件：
1：必须给容器（父元素）加上text-align:center;
2:必须给当前元素转成行内块元素（display:inline-block;）再给当前元素加上vertical-align:middle;
3：在当前元素的后面（没有回车）加上同级元素span;并对span进行vertical-align:middle;width:0;height:100%;display:inline-block

4、置换元素与非置换元素

置换元素与非置换元素

a) 置换元素：浏览器根据元素的标签和属性，来决定元素的具体显示内容。 例如：浏览器会根据标签的src属性的值来读取图片信息并显示出来，而如果查看(x)html代码，则看不到图片的实际内容；标签的type属性来决定是显示输入框，还是单选按钮等。 (x)html中的、、、<select>都是置换元素。这些元素往往没有实际的内容，即是一个空元素。<br><br>置换元素在其显示中生成了框，这也就是有的内联元素（img,input）能够设置宽高的原因。<br><br>b) 不可替换元素（非置换元素）：(x)html 的大多数元素是不可替换元素，即其内容直接表现给用户端（如浏览器）。<br><br>5、什么是精灵图？优势是什么？<br><br>图片整合，将小的单张背景图整合到一张大的背景图上。<br><br>图片整合的优势： 1）通过图片整合来减少对服务器的请求次数，从而提高 页面的加载速度。 2）通过整合图片来减小图片的体积。<br><br>6、什么是<a href="http://www.php.cn/code/5005.html" target="_blank">css层叠</a>样式表？<a href="http://www.php.cn/code/6066.html" target="_blank">优先级</a>算法如何计算？<br><br>a.重要性和来源的优先级排序从低到高是：<br>1）浏览器默认样式<br>2）<a href="http://www.php.cn/wiki/164.html" target="_blank">class</a>/id.....选择器的权重<br>3）行间样式<br>4）内联或者外联 （书写顺序）<br>5）!important 最高的<br><br><br>7、display:none与<a href="http://www.php.cn/wiki/929.html" target="_blank">visibility</a>:hidden的区别<br><br>前者：隐藏不占位  后者：隐藏但是占位置<br><br>8、<a href="http://www.php.cn/code/6337.html" target="_blank">清除浮动</a>的几种方式<br><br>hack1：给父元素添加声明overflow:hidden;<br><br>hack2:   给父元素加height<br><br>hack3:   在浮动元素下方添加空p,并给该元素添加         声明：p{<a href="http://www.php.cn/wiki/917.html" target="_blank">clear</a>:both; height:0; overflow:hidden;}<br><br>hack4:万能清除浮动法 p<a href="http://www.php.cn/wiki/978.html" target="_blank">:after</a>{content:“.”;clear:both;display:block;height:0;overflow:hidden;  visibility:hidden;}<br><br>9、哪些属性可以<a href="http://www.php.cn/code/6064.html" target="_blank">继承</a>？<br><br>1）文字相关：<a href="http://www.php.cn/wiki/804.html" target="_blank">font-family</a>、<a href="http://www.php.cn/wiki/807.html" target="_blank">font-size</a>、<a href="http://www.php.cn/wiki/826.html" target="_blank">font-style</a>、<a href="http://www.php.cn/wiki/862.html" target="_blank">font-variant</a>、<a href="http://www.php.cn/wiki/858.html" target="_blank">font-weight</a>、font、<a href="http://www.php.cn/wiki/865.html" target="_blank">letter-spacing</a>、<a href="http://www.php.cn/wiki/864.html" target="_blank">line-height</a>、text-align、<a href="http://www.php.cn/wiki/867.html" target="_blank">text-indent</a>、<a href="http://www.php.cn/wiki/863.html" target="_blank">text-transform</a>、<a href="http://www.php.cn/wiki/866.html" target="_blank">word-spacing</a><br>2）列表相关：<a href="http://www.php.cn/wiki/954.html" target="_blank">list-style</a>-image、<a href="http://www.php.cn/wiki/955.html" target="_blank">list-style-position</a>、<a href="http://www.php.cn/wiki/956.html" target="_blank">list-style-type</a>、list-style<br>3）颜色相关：color<br>4）透明度（子元素会继承祖元素的opacity，但是无法更改）<br>注：font-size继承的是父元素的大小，而不是比例。line-height当父元素是百分比或px值得时候，子元素跟父元素相同，当父元素是normal或数字的时候，子元素的line-height是子元素的字体大小乘以数字。<br><br>10、定位的方式<br><br>position属性值：<a href="http://www.php.cn/wiki/188.html" target="_blank">static</a>，relative，absolute，fixed<br>1）static<br>static是默认值，元素位于文档流中，正常显示，忽略元素的<a href="http://www.php.cn/wiki/904.html" target="_blank">top</a>，<a href="http://www.php.cn/wiki/906.html" target="_blank">bottom</a>，<a href="http://www.php.cn/wiki/907.html" target="_blank">left</a>，<a href="http://www.php.cn/wiki/905.html" target="_blank">right</a>属性。<a href="http://www.php.cn/wiki/903.html" target="_blank">z-index</a>属性始终为0.<br>2）relative<br>相对定位，保留元素在文档流中占用的位置和尺寸，由left/right/top/bottom几个属性确定相对移动的距离，原来的位置保留<br>3）absolute<br><a href="http://www.php.cn/code/6074.html" target="_blank">绝对定位</a>，将<a href="http://www.php.cn/wiki/60.html" target="_blank">对象</a>从文档流中脱离出来，使用left/right/top/bottom等属性相对其最接近的一个并有定位设置的父元素进行绝对定位；如果没有，则依据body对象<br>4）fixed<br>fixed和absolute差不多，但是他相对的是窗口的左上角，不会跟随文档滚动。但是如果在多frame页面里面，他相对的是所在frame的左上角，而不是浏览器左上角。<br><br>11、link和@import区别？<br><br>1、老祖宗的差别。link属于X<a href="http://www.php.cn/code/427.html" target="_blank">HTML标签</a>，而@import完全是CSS提供的一种方式。<br><br>2、link标签除了可以加载CSS外，还可以做很多其它的事情，比如定义<a href="http://www.php.cn/wiki/1541.html" target="_blank">RSS</a>，定义rel连接属性等，@import就只能加载CSS了<br><br>3、加载顺序的差别。当一个页面被加载的时候（就是被浏览者浏览的时候），link<a href="http://www.php.cn/wiki/231.html" target="_blank">引用</a>的CSS会同时被加载，而@import引用的CSS 会等到页面全部被下载完再被加载。所以有时候浏览@import加载CSS的页面时开始会没有样式（就是闪烁）<br><br>4、兼容性的差别。由于@import是CSS2.1提出的所以老的浏览器不支持，@import只有在IE5以上的才能识别，而link标签无此问题<br><br>5、使用dom控制样式时的差别。当<a href="http://www.php.cn/code/7565.html" target="_blank">使用javascript</a>控制dom去改变样式的时候，只能使用link标签，因为@import不是dom可以控制的<br><br><br>12、定位的属性值都有哪些？每个值得意思？<br><br>各属性值的作用：<br><br>static：默认值。位置设置为 static 的元素会正常显示，它始终会处于文档流给予的位置（static 元素会忽略任何 top、bottom、left 或 right 声明）。<br><br>absolute：相对于父级元素的绝对定位，s浮出、脱离布局流，它不占据空间，就是我们所说的层，其位置相对于最近的已定位父元素而言的位置，可直接指定 “left”、“top”、“right” 以及 “bottom” 属性。若父级都没有定位，则以html（根元素）。(层叠的顺序z-index:value)<br><br>relative：是相对于默认位置的偏移定位，通过设置left、top、right、bottom值可将其移至相对于其正常位置的地方（相对于自己的开始的位置发生的位置上的移动，【不会破坏正常的布局流】<br><br>fixed：相对浏览器的绝对定位，是相对于浏览器窗口的指定坐标进行定位。此元素的位置可通过 "left"、"top"、"right" 以及"bottom" 属性来规定。不论窗口滚动与否，元素都会留在那个位置。<br><br>13、写出html5<a href="http://www.php.cn/php/php-tp-append.html" target="_blank">新增</a>的标签15个<br><br><a href="http://www.php.cn/html/html-HEAD-2.html" target="_blank">head</a>er nav footer <a href="http://www.php.cn/wiki/646.html" target="_blank">main</a> aside article section figure datalist video audio fieldest  legend  label caption<br><br>14、一、BFC是什么？作用？怎么产生？<br><br>1、块级格式化上下文<br>2、自适应两栏布局、清除内部浮动、防止垂直<a href="http://www.php.cn/wiki/931.html" target="_blank">margin</a>重叠（放在两个BFC里）<br>3、根元素、 <a href="http://www.php.cn/wiki/919.html" target="_blank">float</a>属性不为none、 position为absolute或fixed、 display为inline-block，table-cell，table-caption，flex，inline-flex、 overflow不为visible<br><br><br>15、.px，em，rem，pt的区别<br><br>1）px实际上就是像素，用px设置字体大小时，比较稳定和精确<br>但是这种方法存在一个问题，当用户在浏览器中浏览我们制作的web页面时，如果对浏览器进行了缩放，这时会使我们的web<a href="http://www.php.cn/code/7955.html" target="_blank">页面布局</a>被打破。因此，这时就提出了使用“em”来定义web页面的字体。<br>2）em就是根据基准来缩放字体的大小<br>em是相对于其父元素来设置字体大小的，这样就会存在一个问题，进行任何元素设置，都有可能需要知道他父元素的大小<br>3）rem是相对于根元素字体大小来显示的<br>rem是相对于根元素<html>，这样就意味着，我们只需要在根元素确定一个参考值<br>4）pt的大小等于1英寸的1/72<br>磅：他是作为文字的一种计量单位<br>这种度量方式来源于打印-设计背景，最适合于媒体，但同样广泛应用于显示器<br><br>16、实现垂直+水平居中有哪些方法？<br><br>1、p{width:200px;height:200px;<a href="http://www.php.cn/wiki/892.html" target="_blank">background</a>:#f00;position:fixed;left:0;right:0;top:0;bottom:0;margin:auto;}<br><br>2、p{width:200px;height:200px;background:#f00;position:fixed;left:50%;top:50%;margin:-100px 0 0 -100px;}<br><br>17、渐进增强和优雅降级<br><br>渐进增强 progressive enhancement：针对低版本浏览器进行构建页面，保证最基本的功能，然后再针对高级浏览器进行效果、交互等改进和追加功能达到更好的用户体验。<br><br>优雅降级 graceful degradation：一开始就构建完整的功能，然后再针对低版本浏览器进行兼容<br><br><br>18、css选择符有哪些？<br><br>1）通配选择符      *<br>2）类型选择符 /元素选择符     a<br>3）属性选择符      input[type="button"]4）包含选择符     p .code a<br>5）子对象选择符     ul.test>li<br>6）ID选择符     #<br>7）类选择符     .<br>8）群组选择符     body,ul,li<br>9）<a href="http://www.php.cn/code/6014.html" target="_blank">伪类</a>及伪对象选择符     p<a href="http://www.php.cn/wiki/970.html" target="_blank">:first-letter</a>     a<a href="http://www.php.cn/wiki/966.html" target="_blank">:hover</a><br>10）相邻选择符     li+li<br><br>19、animation和transition的区别<br>相同点：都是随着时间改变元素的属性值。<br><br>不同点： transition需要触发一个<a href="http://www.php.cn/php/php-tp-incident.html" target="_blank">事件</a>(hover事件或click事件等)才会随时间改变其<br><br>css属性； 而animation在不需要触发任何事件的情况下也可以显式的随着时间变化来改变元素css的属性值，从而达到一种<a href="http://www.php.cn/code/9595.html" target="_blank">动画</a>的效果，css3的animation就需要明确的动画属性值。<br><br>20、什么是标准<a href="http://www.php.cn/code/6444.html" target="_blank">盒模型</a>和怪异盒模型。两者的区别，如何实现怪异盒模型，和标准和模型<br><br>标准盒模型：content+border+<a href="http://www.php.cn/wiki/948.html" target="_blank">padding</a>      <br>怪异盒模型：content<br><br>一个算盒子的宽度的时候加上border和padding另一个不加<br><br>怪异盒模型实现：box-sizing:border-box<br>标准盒模型：box-sizing:content-box<br><br><br>21、如何让一个元素在父元素内上下左右居中<br><br>1.<br>css：<br>.box{display:flex;width:800px;height:<a href="http://www.php.cn/code/4221.html" target="_blank">300</a>px;just<a href="http://www.php.cn/wiki/109.html" target="_blank">if</a>y-content:center}<br>.box p{align-self:center}<br><br>html:<br><p class="box"><br>     <p></p><br></p><br><br>2.<br>css:<br>.box{display:flex;width:800px;height:800px;justify-content:center;align-items:center;}<br>html:<br><p class="box"><br>     <p></p><br></p><br><br>22、video与audio常用的格式有哪些<br>用于<a href="http://www.php.cn/code/6707.html" target="_blank">视频</a>：video/ogg   video/mp4     video/webm 用于<a href="http://www.php.cn/code/6093.html" target="_blank">音频</a>：audio/ogg   audio/mpeg<br><br>23、简单的解释下<a href="http://www.php.cn/code/10723.html" target="_blank">弹性盒模型</a>的属性和属性值（至少写出6个属性）<br><br>display:flex;<br>flex-<a href="http://www.php.cn/wiki/873.html" target="_blank">direction</a>:<br>justify-content:<br>align-items:<br>align-self:<br>align-content:<br>flex-wrap:<br><br>23、简单的介绍一下线性渐变和径向渐变、重复渐变的用法<br><br>线性渐变：linear-gradient()<br>径向渐变：radial-gradient()<br>重复线性渐变：repeating-linear-gradient()<br>重复径向渐变：repeating-radial-gradient()<br><br>24、简单介绍下animation的用法<br><br>animation有两部分组成：animation:动画名称  动画执行时间  动画类型 动画延迟时间  动画重复次数 动画方向； @<a href="http://www.php.cn/wiki/1051.html" target="_blank">key</a>frames 动画名字<br><br>25、css3D的主要几个属性和属性值<br>1、景深：perspactive:number;     想要看到的物体越大，那么就把值设的较小，如果要看物体看的越小就把值设的越大<br><br>2、3D的舞台：transform-style:preserve-3d;<br><br>3、translateZ()   rotateZ()   scaleZ()<br><br>26、2D中的主要几个属性<br><br>transform:translate()   rotate() skew()  scale()<br>transform-origin:<br><br>27、简单介绍过度动画的属性和属性值<br><br>transition:属性名称（可以用<a href="http://www.php.cn/wiki/1483.html" target="_blank">all</a>） 动画执行的时间  动画的类型  动画的延迟时间<br><br>28、css3中新增的<a href="http://www.php.cn/code/6021.html" target="_blank">背景属性</a><br><br><a href="http://www.php.cn/code/865.html" target="_blank">background-origin</a>:背景原点<br><a href="http://www.php.cn/code/868.html" target="_blank">background-clip</a>:背景裁切<br><a href="http://www.php.cn/code/872.html" target="_blank">background-size</a>:<a href="http://www.php.cn/code/8294.html" target="_blank">背景图像</a>的尺寸<br>以下为background-size的三个值<br><br>length<br>规定背景图的大小。第一个值宽度，第二个值高度。<br><br>Percentage(%)<br>以百分比为值设置背景图大小<br><br>cover<br>把背景图像扩展至足够大，以使背景图像完全覆盖背景区域<br>   <br><br><br>29、写出5大浏览器的内核以及他们的代表作品<br><br>*Trident: IE、Maxthon(遨游)、腾讯 、Theworld世界之窗、360浏览器<br><br>*Gecko：： 代表作品Mozilla Firefox 是开源的<br><br>*Webkit : 代表作品Safari、Chrome ， 是一个开源项目。<br><br>*Presto : 代表作品Opera ，Presto是由Opera Software开发的浏览器排版引擎。它也是世界上公认的渲染速度最快的引擎。<br><br>*Blink  ：由Google和Opera Software开发的浏览器排版引擎，2013年4月发布。<br><br>30、写出IE6里面常见的几种bug以及解决方案(最少4种)<br><br>1)图片有边框BUG         方案：给图片加border:0;或者border:0    none;<br><br>2、双倍浮向（双倍边距）   方案：display:inline<br><br>3、默认高度（IE6、IE7）  方案：给元素添加声明：font-size:0;   方案2：给元素添加声明：overflow:hidden;<br><br>4、按钮元素默认大小不一   方案：用a标签模拟<br><br>31、IE的<a href="http://www.php.cn/code/120.html" target="_blank">过滤器</a>有哪些？<br><br>1、  _ 下划线属性过滤器<br>2、  \9 ：  IE版本识别；其他浏览器都不识别 语法：选择符{属性：属性值\9;}<br>3、  \0  :   IE8及以上版本识别；其他浏览器都不识别     语法：选择符{属性：属性值\0；}<br><br>32、元素高度塌陷解决方案（至少4种）<br>hack1：给父元素添加声明overflow:hidden;<br><br>hack2:   给父元素加height<br><br>hack3:   在浮动元素下方添加空p,并给该元素添加         声明：p{clear:both; height:0; overflow:hidden;}<br><br>hack4:万能清除浮动法 p:after{content:“.”;clear:both;display:block;height:0;overflow:hidden;  visibility:hidden;}</article><ul class=" list-paddingleft-2"></ul><p>以上是html 5常见的面试题的详细内容。更多信息请关注PHP中文网其他相关文章！</p> </div> </div> <div style="height: 25px;"> <div class="wzconBq" style="display: inline-flex;"> <span>相关标签：</span> <div class="wzcbqd"> <a onclick="hits_log(2,'www',this);" href-data="https://www.php.cn/zh/search?word=htmlcss" target="_blank">Html/css</a> </div> </div> <div style="display: inline-flex;float: right; color:#333333;">来源：php.cn</div> </div> <div class="wzconOtherwz"> <a href="https://www.php.cn/zh/faq/359949.html" title="css多行省略号兼容性写法"> <span>上一篇：css多行省略号兼容性写法</span> </a> <a href="https://www.php.cn/zh/faq/359951.html" title="移动端最佳字体大小设置"> <span>下一篇：移动端最佳字体大小设置</span> </a> </div> <div class="wzconShengming"> <div class="bzsmdiv">本站声明</div> <div>本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn</div> </div> <div class="wwads-cn wwads-horizontal" data-id="156" style="max-width:955px"></div> <div class="wzconZzwz"> <div class="wzconZzwztitle">作者最新文章</div> <ul> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh/faq/1796629438.html">编码的关键：为初学者释放 C 的力量</a> </div> <div>2024-10-13 11:44:01</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh/faq/1796629203.html">使用 PHP 和 MySQL 将您的网站连接到数据库</a> </div> <div>2024-10-13 09:56:31</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh/faq/1796627843.html">使用 Python 解决问题：作为初学者，解锁强大的解决方案</a> </div> <div>2024-10-11 20:58:41</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh/faq/1796627712.html">Python 的力量，简单：一种适合初学者的编程方法</a> </div> <div>2024-10-11 16:53:11</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh/faq/1796627515.html">PHP 和社交媒体：将您的网站与世界融为一体</a> </div> <div>2024-10-11 11:54:51</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh/faq/1796627348.html">使用 PHP 的动态图像画廊：在线展示您的作品</a> </div> <div>2024-10-10 16:21:01</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh/faq/1796627317.html">使用 PHP 构建 API 和 Web 服务</a> </div> <div>2024-10-10 15:18:02</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh/faq/1796627273.html">揭秘 Java：为新程序员提供一条清晰、简单的道路</a> </div> <div>2024-10-10 13:34:01</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh/faq/1796627270.html">使用 C 创建游戏和图形：有趣且实用的介绍</a> </div> <div>2024-10-10 13:26:26</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh/faq/1796627154.html">王者荣耀程咬金怎么玩？</a> </div> <div>2024-10-10 11:38:42</div> </li> </ul> </div> <div class="wzconZzwz"> <div class="wzconZzwztitle">最新问题</div> <div class="wdsyContent"> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="https://www.php.cn/zh/wenda/176405.html" target="_blank" title="关于CSS思维导图的课件在哪？" class="wdcdcTitle">关于CSS思维导图的课件在哪？</a> <a href="https://www.php.cn/zh/wenda/176405.html" class="wdcdcCons">课件</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> <span class="wdcdciSpan"> 来自于 2024-04-16 10:10:18</span> </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> <b class="wdcdcirdzi"></b>0 </div> <div class="wdcdcirpl flexRow ira"><b class="wdcdcirpli"></b>0</div> <div class="wdcdcirwatch flexRow ira"><b class="wdcdcirwatchi"></b>1335</div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="https://www.php.cn/zh/wenda/176403.html" target="_blank" title="PX自动转换为REM错误" class="wdcdcTitle">PX自动转换为REM错误</a> <a href="https://www.php.cn/zh/wenda/176403.html" class="wdcdcCons"> <style>html {   字体大小：calc(100vw / 3.75);      }body {    字体大小：0.16rem；      }</s...</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> <span class="wdcdciSpan"> 来自于 2024-04-16 09:34:16</span> </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> <b class="wdcdcirdzi"></b>0 </div> <div class="wdcdcirpl flexRow ira"><b class="wdcdcirpli"></b>0</div> <div class="wdcdcirwatch flexRow ira"><b class="wdcdcirwatchi"></b>4687</div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="https://www.php.cn/zh/wenda/176396.html" target="_blank" title="页面突然无法拉动 css 或 bootstrap" class="wdcdcTitle">页面突然无法拉动 css 或 bootstrap</a> <a href="https://www.php.cn/zh/wenda/176396.html" class="wdcdcCons">所以我正在开发一个页面，我昨天做了一部分，效果很好，今天我继续做剩下的部分，一切都很好。当我尝试将其作为普通html页面打开时，CSS或BOOTSTRAP不起作用，仅显示页面文本，...</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> <span class="wdcdciSpan"> 来自于 2024-04-06 21:58:04</span> </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> <b class="wdcdcirdzi"></b>0 </div> <div class="wdcdcirpl flexRow ira"><b class="wdcdcirpli"></b>1</div> <div class="wdcdcirwatch flexRow ira"><b class="wdcdcirwatchi"></b>800</div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="https://www.php.cn/zh/wenda/176389.html" target="_blank" title="动态修改Javafx中的内联CSS样式" class="wdcdcTitle">动态修改Javafx中的内联CSS样式</a> <a href="https://www.php.cn/zh/wenda/176389.html" class="wdcdcCons">我试图在应用程序最大化时更改窗格的背景图像。我的背景是使用内嵌css设置的。我为样式设置了两个不同的变量和一个if语句。但是，我没有运气让它改变样式。StringcssStyle=...</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> <span class="wdcdciSpan"> 来自于 2024-04-06 20:57:16</span> </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> <b class="wdcdcirdzi"></b>0 </div> <div class="wdcdcirpl flexRow ira"><b class="wdcdcirpli"></b>1</div> <div class="wdcdcirwatch flexRow ira"><b class="wdcdcirwatchi"></b>487</div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="https://www.php.cn/zh/wenda/176388.html" target="_blank" title="如何在 CSS 中使浮动元素垂直堆叠而不是水平堆叠？" class="wdcdcTitle">如何在 CSS 中使浮动元素垂直堆叠而不是水平堆叠？</a> <a href="https://www.php.cn/zh/wenda/176388.html" class="wdcdcCons">我正在尝试制作一个包含两列的网页，一侧具有主要内容，另一侧具有额外的内容。但是因为我使用浮动属性将额外的列向左对齐，所以它水平堆叠，但我希望它垂直堆叠。我当前的代码：.topich...</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> <span class="wdcdciSpan"> 来自于 2024-04-06 20:45:26</span> </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> <b class="wdcdcirdzi"></b>0 </div> <div class="wdcdcirpl flexRow ira"><b class="wdcdcirpli"></b>2</div> <div class="wdcdcirwatch flexRow ira"><b class="wdcdcirwatchi"></b>386</div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> </div> </div> <div class="wzconZt" > <div class="wzczt-title"> <div>相关专题</div> <a href="https://www.php.cn/zh/faq/zt" target="_blank">更多> </a> </div> <div class="wzcttlist"> <ul> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh/faq/perttzmh"><img src="https://img.php.cn/upload/subject/202407/22/2024072213384630576.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="pert图怎么画" /> </a> <a target="_blank" href="https://www.php.cn/zh/faq/perttzmh" class="title-a-spanl" title="pert图怎么画"><span>pert图怎么画</span> </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh/faq/javafwkzxsfjs"><img src="https://img.php.cn/upload/subject/202407/22/2024072214054037621.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="java访问控制修饰符介绍" /> </a> <a target="_blank" href="https://www.php.cn/zh/faq/javafwkzxsfjs" class="title-a-spanl" title="java访问控制修饰符介绍"><span>java访问控制修饰符介绍</span> </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh/faq/phpszdxbcnks"><img src="https://img.php.cn/upload/subject/202407/22/2024072213212838025.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="php数组的下标从哪开始" /> </a> <a target="_blank" href="https://www.php.cn/zh/faq/phpszdxbcnks" class="title-a-spanl" title="php数组的下标从哪开始"><span>php数组的下标从哪开始</span> </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh/faq/wsmymsdbk"><img src="https://img.php.cn/upload/subject/202407/22/2024072213512719896.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="为什么亚马逊打不开" /> </a> <a target="_blank" href="https://www.php.cn/zh/faq/wsmymsdbk" class="title-a-spanl" title="为什么亚马逊打不开"><span>为什么亚马逊打不开</span> </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh/faq/mysqlhsqlserv"><img src="https://img.php.cn/upload/subject/202407/22/2024072212223124785.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="mysql和sql_server的区别" /> </a> <a target="_blank" href="https://www.php.cn/zh/faq/mysqlhsqlserv" class="title-a-spanl" title="mysql和sql_server的区别"><span>mysql和sql_server的区别</span> </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh/faq/winkjfwjjfw"><img src="https://img.php.cn/upload/subject/202407/22/2024072213394956300.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="win10开机拒绝访问怎么解决" /> </a> <a target="_blank" href="https://www.php.cn/zh/faq/winkjfwjjfw" class="title-a-spanl" title="win10开机拒绝访问怎么解决"><span>win10开机拒绝访问怎么解决</span> </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh/faq/wifiytyssmys"><img src="https://img.php.cn/upload/subject/202407/22/2024072213301131723.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="wifi已停用是指什么" /> </a> <a target="_blank" href="https://www.php.cn/zh/faq/wifiytyssmys" class="title-a-spanl" title="wifi已停用是指什么"><span>wifi已停用是指什么</span> </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh/faq/pngssmgs"><img src="https://img.php.cn/upload/subject/202407/22/2024072214220765876.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="png是什么格式" /> </a> <a target="_blank" href="https://www.php.cn/zh/faq/pngssmgs" class="title-a-spanl" title="png是什么格式"><span>png是什么格式</span> </a> </li> </ul> </div> </div> </div> </div> <div class="phpwzright"> <div class="wzrOne"> <div class="wzroTitle">热门推荐</div> <div class="wzroList"> <ul> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a style="height: auto;" title="url是什么意思？" href="https://www.php.cn/zh/faq/418772.html">url是什么意思？</a> </div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a style="height: auto;" title="DOM是什么意思" href="https://www.php.cn/zh/faq/414303.html">DOM是什么意思</a> </div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a style="height: auto;" title="如何改变图片大小" href="https://www.php.cn/zh/faq/414252.html">如何改变图片大小</a> </div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a style="height: auto;" title="HTML中如何将字体加粗" href="https://www.php.cn/zh/faq/414520.html">HTML中如何将字体加粗</a> </div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a style="height: auto;" title="html图片大小如何设置" href="https://www.php.cn/zh/faq/475145.html">html图片大小如何设置</a> </div> </li> </ul> </div> </div> <script src="https://sw.php.cn/hezuo/cac1399ab368127f9b113b14eb3316d0.js" type="text/javascript"></script> <div class="wzrThree"> <div class="wzrthree-title"> <div>热门教程</div> <a target="_blank" href="https://www.php.cn/zh/course.html">更多> </a> </div> <div class="wzrthreelist swiper2"> <div class="wzrthreeTab swiper-wrapper"> <div class="check tabdiv swiper-slide" data-id="one">相关教程 <div></div></div> <div class="tabdiv swiper-slide" data-id="two">热门推荐<div></div></div> <div class="tabdiv swiper-slide" data-id="three">最新课程<div></div></div> </div> <ul class="one"> <li> <a target="_blank" href="https://www.php.cn/zh/course/812.html" title="最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/041/620debc3eab3f377.jpg" alt="最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)"/> </a> <div class="wzrthree-right"> <a target="_blank" title="最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)" href="https://www.php.cn/zh/course/812.html">最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)</a> <div class="wzrthreerb"> <div>1420867 <b class="kclbcollectb"></b></div> <div class="courseICollection" data-id="812"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/74.html" title="php入门教程之一周学会PHP" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/6253d1e28ef5c345.png" alt="php入门教程之一周学会PHP"/> </a> <div class="wzrthree-right"> <a target="_blank" title="php入门教程之一周学会PHP" href="https://www.php.cn/zh/course/74.html">php入门教程之一周学会PHP</a> <div class="wzrthreerb"> <div>4264361 <b class="kclbcollectb"></b></div> <div class="courseICollection" data-id="74"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/286.html" title="JAVA 初级入门视频教程" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62590a2bacfd9379.png" alt="JAVA 初级入门视频教程"/> </a> <div class="wzrthree-right"> <a target="_blank" title="JAVA 初级入门视频教程" href="https://www.php.cn/zh/course/286.html">JAVA 初级入门视频教程</a> <div class="wzrthreerb"> <div>2513372 <b class="kclbcollectb"></b></div> <div class="courseICollection" data-id="286"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/504.html" title="小甲鱼零基础入门学习Python视频教程" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62590a67ce3a6655.png" alt="小甲鱼零基础入门学习Python视频教程"/> </a> <div class="wzrthree-right"> <a target="_blank" title="小甲鱼零基础入门学习Python视频教程" href="https://www.php.cn/zh/course/504.html">小甲鱼零基础入门学习Python视频教程</a> <div class="wzrthreerb"> <div>505943 <b class="kclbcollectb"></b></div> <div class="courseICollection" data-id="504"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/2.html" title="PHP 零基础入门教程" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/6253de27bc161468.png" alt="PHP 零基础入门教程"/> </a> <div class="wzrthree-right"> <a target="_blank" title="PHP 零基础入门教程" href="https://www.php.cn/zh/course/2.html">PHP 零基础入门教程</a> <div class="wzrthreerb"> <div>861089 <b class="kclbcollectb"></b></div> <div class="courseICollection" data-id="2"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> </ul> <ul class="two" style="display: none;"> <li> <a target="_blank" href="https://www.php.cn/zh/course/812.html" title="最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/041/620debc3eab3f377.jpg" alt="最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)"/> </a> <div class="wzrthree-right"> <a target="_blank" title="最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)" href="https://www.php.cn/zh/course/812.html">最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)</a> <div class="wzrthreerb"> <div >1420867次学习</div> <div class="courseICollection" data-id="812"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/286.html" title="JAVA 初级入门视频教程" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62590a2bacfd9379.png" alt="JAVA 初级入门视频教程"/> </a> <div class="wzrthree-right"> <a target="_blank" title="JAVA 初级入门视频教程" href="https://www.php.cn/zh/course/286.html">JAVA 初级入门视频教程</a> <div class="wzrthreerb"> <div >2513372次学习</div> <div class="courseICollection" data-id="286"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/504.html" title="小甲鱼零基础入门学习Python视频教程" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62590a67ce3a6655.png" alt="小甲鱼零基础入门学习Python视频教程"/> </a> <div class="wzrthree-right"> <a target="_blank" title="小甲鱼零基础入门学习Python视频教程" href="https://www.php.cn/zh/course/504.html">小甲鱼零基础入门学习Python视频教程</a> <div class="wzrthreerb"> <div >505943次学习</div> <div class="courseICollection" data-id="504"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/901.html" title="Web前端开发极速入门" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/64be28a53a4f6310.png" alt="Web前端开发极速入门"/> </a> <div class="wzrthree-right"> <a target="_blank" title="Web前端开发极速入门" href="https://www.php.cn/zh/course/901.html">Web前端开发极速入门</a> <div class="wzrthreerb"> <div >215592次学习</div> <div class="courseICollection" data-id="901"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/234.html" title="零基础精通 PS 视频教程" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62611f57ed0d4840.jpg" alt="零基础精通 PS 视频教程"/> </a> <div class="wzrthree-right"> <a target="_blank" title="零基础精通 PS 视频教程" href="https://www.php.cn/zh/course/234.html">零基础精通 PS 视频教程</a> <div class="wzrthreerb"> <div >885592次学习</div> <div class="courseICollection" data-id="234"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> </ul> <ul class="three" style="display: none;"> <li> <a target="_blank" href="https://www.php.cn/zh/course/1648.html" title="【web前端】Node.js快速入门" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png" alt="【web前端】Node.js快速入门"/> </a> <div class="wzrthree-right"> <a target="_blank" title="【web前端】Node.js快速入门" href="https://www.php.cn/zh/course/1648.html">【web前端】Node.js快速入门</a> <div class="wzrthreerb"> <div >7158次学习</div> <div class="courseICollection" data-id="1648"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/1647.html" title="国外Web开发全栈课程全集" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/6628cc96e310c937.png" alt="国外Web开发全栈课程全集"/> </a> <div class="wzrthree-right"> <a target="_blank" title="国外Web开发全栈课程全集" href="https://www.php.cn/zh/course/1647.html">国外Web开发全栈课程全集</a> <div class="wzrthreerb"> <div >5557次学习</div> <div class="courseICollection" data-id="1647"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/1646.html" title="Go语言实战之 GraphQL" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/662221173504a436.png" alt="Go语言实战之 GraphQL"/> </a> <div class="wzrthree-right"> <a target="_blank" title="Go语言实战之 GraphQL" href="https://www.php.cn/zh/course/1646.html">Go语言实战之 GraphQL</a> <div class="wzrthreerb"> <div >4681次学习</div> <div class="courseICollection" data-id="1646"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/1645.html" title="550W粉丝大佬手把手从零学JavaScript" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/662077e163124646.png" alt="550W粉丝大佬手把手从零学JavaScript"/> </a> <div class="wzrthree-right"> <a target="_blank" title="550W粉丝大佬手把手从零学JavaScript" href="https://www.php.cn/zh/course/1645.html">550W粉丝大佬手把手从零学JavaScript</a> <div class="wzrthreerb"> <div >670次学习</div> <div class="courseICollection" data-id="1645"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/1644.html" title="python大神Mosh，零基础小白6小时完全入门" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/6616418ca80b8916.png" alt="python大神Mosh，零基础小白6小时完全入门"/> </a> <div class="wzrthree-right"> <a target="_blank" title="python大神Mosh，零基础小白6小时完全入门" href="https://www.php.cn/zh/course/1644.html">python大神Mosh，零基础小白6小时完全入门</a> <div class="wzrthreerb"> <div >23656次学习</div> <div class="courseICollection" data-id="1644"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> </ul> </div> <script> var mySwiper = new Swiper('.swiper2', { autoplay: false,//可选选项，自动滑动 slidesPerView : 'auto', }) $('.wzrthreeTab>div').click(function(e){ $('.wzrthreeTab>div').removeClass('check') $(this).addClass('check') $('.wzrthreelist>ul').css('display','none') $('.'+e.currentTarget.dataset.id).show() }) </script> </div> <div class="wzrFour"> <div class="wzrfour-title"> <div>最新下载</div> <a href="https://www.php.cn/zh/xiazai">更多> </a> </div> <script> $(document).ready(function(){ var sjyx_banSwiper = new Swiper(".sjyx_banSwiperwz",{ speed:1000, autoplay:{ delay:3500, disableOnInteraction: false, }, pagination:{ el:'.sjyx_banSwiperwz .swiper-pagination', clickable :false, }, loop:true }) }) </script> <div class="wzrfourList swiper3"> <div class="wzrfourlTab swiper-wrapper"> <div class="check swiper-slide" data-id="onef">网站特效 <div></div></div> <div class="swiper-slide" data-id="twof">网站源码<div></div></div> <div class="swiper-slide" data-id="threef">网站素材<div></div></div> <div class="swiper-slide" data-id="fourf">前端模板<div></div></div> </div> <ul class="onef"> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="jQuery企业留言表单联系代码" href="https://www.php.cn/zh/toolset/js-special-effects/8071">[表单按钮] jQuery企业留言表单联系代码</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="HTML5 MP3音乐盒播放特效" href="https://www.php.cn/zh/toolset/js-special-effects/8070">[播放器特效] HTML5 MP3音乐盒播放特效</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="HTML5炫酷粒子动画导航菜单特效" href="https://www.php.cn/zh/toolset/js-special-effects/8069">[菜单导航] HTML5炫酷粒子动画导航菜单特效</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="jQuery可视化表单拖拽编辑代码" href="https://www.php.cn/zh/toolset/js-special-effects/8068">[表单按钮] jQuery可视化表单拖拽编辑代码</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="VUE.JS仿酷狗音乐播放器代码" href="https://www.php.cn/zh/toolset/js-special-effects/8067">[播放器特效] VUE.JS仿酷狗音乐播放器代码</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="经典html5推箱子小游戏" href="https://www.php.cn/zh/toolset/js-special-effects/8066">[html5特效] 经典html5推箱子小游戏</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="jQuery滚动添加或减少图片特效" href="https://www.php.cn/zh/toolset/js-special-effects/8065">[图片特效] jQuery滚动添加或减少图片特效</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="CSS3个人相册封面悬停放大特效" href="https://www.php.cn/zh/toolset/js-special-effects/8064">[相册特效] CSS3个人相册封面悬停放大特效</a> </div> </li> </ul> <ul class="twof" style="display:none"> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8328" title="家居装潢清洁维修服务公司网站模板" target="_blank">[前端模板] 家居装潢清洁维修服务公司网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8327" title="清新配色个人求职简历引导页模板" target="_blank">[前端模板] 清新配色个人求职简历引导页模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8326" title="设计师创意求职简历网页模板" target="_blank">[前端模板] 设计师创意求职简历网页模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8325" title="现代工程建筑公司网站模板" target="_blank">[前端模板] 现代工程建筑公司网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8324" title="教育服务机构响应式HTML5模板" target="_blank">[前端模板] 教育服务机构响应式HTML5模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8323" title="网上电子书店商城网站模板" target="_blank">[前端模板] 网上电子书店商城网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8322" title="IT技术解决互联网公司网站模板" target="_blank">[前端模板] IT技术解决互联网公司网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8321" title="紫色风格外汇交易服务网站模板" target="_blank">[前端模板] 紫色风格外汇交易服务网站模板</a> </div> </li> </ul> <ul class="threef" style="display:none"> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-materials/3078" target="_blank" title="可爱的夏天元素矢量素材(EPS+PNG)">[PNG素材] 可爱的夏天元素矢量素材(EPS+PNG)</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-materials/3077" target="_blank" title="四个红的的 2023 毕业徽章矢量素材(AI+EPS+PNG)">[PNG素材] 四个红的的 2023 毕业徽章矢量素材(AI+EPS+PNG)</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-materials/3076" target="_blank" title="唱歌的小鸟和装满花朵的推车设计春天banner矢量素材(AI+EPS)">[banner图] 唱歌的小鸟和装满花朵的推车设计春天banner矢量素材(AI+EPS)</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-materials/3075" target="_blank" title="金色的毕业帽矢量素材(EPS+PNG)">[PNG素材] 金色的毕业帽矢量素材(EPS+PNG)</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-materials/3074" target="_blank" title="黑白风格的山脉图标矢量素材(EPS+PNG)">[PNG素材] 黑白风格的山脉图标矢量素材(EPS+PNG)</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-materials/3073" target="_blank" title="不同颜色披风和不同姿势的超级英雄剪影矢量素材(EPS+PNG)">[PNG素材] 不同颜色披风和不同姿势的超级英雄剪影矢量素材(EPS+PNG)</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-materials/3072" target="_blank" title="扁平风格的植树节banner矢量素材(AI+EPS)">[banner图] 扁平风格的植树节banner矢量素材(AI+EPS)</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-materials/3071" target="_blank" title="九个漫画风格的爆炸聊天气泡矢量素材(EPS+PNG)">[PNG素材] 九个漫画风格的爆炸聊天气泡矢量素材(EPS+PNG)</a> </div> </li> </ul> <ul class="fourf" style="display:none"> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8328" target="_blank" title="家居装潢清洁维修服务公司网站模板">[前端模板] 家居装潢清洁维修服务公司网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8327" target="_blank" title="清新配色个人求职简历引导页模板">[前端模板] 清新配色个人求职简历引导页模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8326" target="_blank" title="设计师创意求职简历网页模板">[前端模板] 设计师创意求职简历网页模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8325" target="_blank" title="现代工程建筑公司网站模板">[前端模板] 现代工程建筑公司网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8324" target="_blank" title="教育服务机构响应式HTML5模板">[前端模板] 教育服务机构响应式HTML5模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8323" target="_blank" title="网上电子书店商城网站模板">[前端模板] 网上电子书店商城网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8322" target="_blank" title="IT技术解决互联网公司网站模板">[前端模板] IT技术解决互联网公司网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8321" target="_blank" title="紫色风格外汇交易服务网站模板">[前端模板] 紫色风格外汇交易服务网站模板</a> </div> </li> </ul> </div> <script> var mySwiper = new Swiper('.swiper3', { autoplay: false,//可选选项，自动滑动 slidesPerView : 'auto', }) $('.wzrfourlTab>div').click(function(e){ $('.wzrfourlTab>div').removeClass('check') $(this).addClass('check') $('.wzrfourList>ul').css('display','none') $('.'+e.currentTarget.dataset.id).show() }) </script> </div> </div> </div> <footer> <div class="footer"> <div class="footertop"> <img src="/static/imghw/logo.png" alt=""> <p>公益在线PHP培训，帮助PHP学习者快速成长！</p> </div> <div class="footermid"> <a href="https://www.php.cn/zh/about/us.html">关于我们</a> <a href="https://www.php.cn/zh/about/disclaimer.html">免责声明</a> <a href="https://www.php.cn/zh/update/article_0_1.html">Sitemap</a> </div> <div class="footerbottom"> <p> © php.cn All rights reserved </p> </div> </div> </footer> <input type="hidden" id="verifycode" value="/captcha.html"> <script>layui.use(['element', 'carousel'], function () {var element = layui.element;$ = layui.jquery;var carousel = layui.carousel;carousel.render({elem: '#test1', width: '100%', height: '330px', arrow: 'always'});$.getScript('/static/js/jquery.lazyload.min.js', function () {$("img").lazyload({placeholder: "/static/images/load.jpg", effect: "fadeIn", threshold: 200, skip_invisible: false});});});</script> <script src="/static/js/common_new.js"></script> <script type="text/javascript" src="/static/js/jquery.cookie.js?1732609362"></script> <script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script> <link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css?2' type='text/css' media='all'/> <script type='text/javascript' src='/static/js/viewer.min.js?1'></script> <script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script> <script type="text/javascript" src="/static/js/global.min.js?5.5.53"></script> </body> </html>