首页
学习
活动
专区
圈层
工具
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    不用JS,教你只用纯HTML做出几个实用网页效果

    在我们以往看到的页面效果中,很多效果是需要JS搭配使用的,而今天在本文中,我将介绍如何使用纯HTML打造属于自己的实用效果。 1....折叠手风琴 使用Details和Summary标签可以创建没有JavaScript代码的可折叠手风琴。 效果: ?...box-shadow: 0 1px 0 rgba(12,13,14,0.2), 0 0 0 2px #FFF inset; white-space: nowrap; } 8.使用HTML共享代码...使用figcaption pre code标签,您可以使用纯HTML和CSS呈现出不错的代码片段。...例如:您希望在您的页面中加入Excel功能,可以尝试纯前端表格控件SpreadJS,再或者您希望为用户提供更完备、更高效的前端UI控件,您也不妨可以试试WimoJS。 想信她们都能为您的应用增色不少。

    2.4K40

    35行代码下载任意网页的图片

    一、简介 有没有一种代码可能实现下载任意网页的图片,这样对于需要下载大量壁纸,图片的小伙伴来说真是一个好福利,今天我们就来试试。...先看视频演示效果 35行代码下载任意网页的图片_演示视频 https://v.qq.com/x/page/f3220zfigqq.html 二、分析 爬取过网页图片的小伙伴都知道,需要通过lxml去解析对应的网页...,每一个网页的网页标签结构不一样,因此爬取一个网站的图片就需要解析一次,那想爬取多个网站时,那........,(打扰了,告辞) 因此我们来看一下网页的图片存放在哪个网页标签 案例网页1 ###网页链接 http://desk.zol.com.cn/bizhi/9461_115065_2.html ?...三、代码 所需库 import re import requests re是正则表达式的库,requests用于获取网页数据 请求网页 #请求头 headers = { 'user-agent

    65510

    【 前端相关 网页组件 】纯CSS3实现 “图片轮播” 效果

    使用纯CSS3代码实现简单的图片轮播 image.png 原理介绍 跑马灯图 : image.png 灯图原理 : image.png 基本思路 1.基本布局: 将5张图片左浮动横向并排放入一个...H5结构代码: image.png 2.设置动画: 然后使用CSS3动画,通过对photos进行位移,从而达到显示不同的图片,每次偏移一个图片的宽度,即可显示下一张图片。...即20%~40%里面包含切换到第二张图片并且将第二张图片静置。另外,根据需要可以对各个图片添加相应的序号和图片简介。 C3动画代码: image.png 全部代码 飛天网事--纯CSS代码实现图片轮播 ...纯css3代码图片轮播,HTML5+CSS3精彩案例" /> <meta name="keywords

    1.9K90

    延时加载 JS 代码,提高网页加载速度

    如果网页中存在大量的 javascript 代码会极大的影响网页的访问速度,下面就简单介绍一下如何延时加载 js 代码提高速度。...js.src="js/js.js"; } setTimeout(addjs,3000); 以上代码可以实现 js 代码在 3 秒之后再加载,这样可以在一定程度上提高速度。...二.将js代码放到网页内容的后面: 这个比较简单了,就不用说了,就是将 js 代码放在网页内容的后面,一把是放在body的最底部,这样也可以先加载内容再去执行 js 代码,也能够提高一定的速度。...JS 广告代码延迟加载或是最后加载加快页面载入 JS 广告代码延迟加载或是最后加载加快页面载入,如果页面中有很多 JS 广告代码,或者其他的 js/' target='_blank' class='u'... 当然,那个 LOADING… 你可以换成自己喜欢的小图片.看起来很有 AJAX 效果呢.

    7.8K30
    领券