CSS3
关注
分享
扫一扫
文章平均质量分 55
阿酷tony
这个作者很懒，什么都没留下…
展开
-
HTML5+CSS多层级ol标签序号样式问题
HTML5+CSS多层级ol标签序号样式问题.在CSS中，ol标签用于创建有序列表，而多层级的ol标签可以通过CSS实现不同的序号样式。以下是一些常见的问题和解决方案原创 2025-02-17 18:14:59 · 488 阅读 · 0 评论 -
Bootstrap Popover-X，打造非凡弹出体验
在前端开发的世界里，细节决定成败。如果你正在寻找一个能够增强用户交互体验的工具，那么【Bootstrap Popover-X】绝对值得一试。本文将从项目介绍、技术分析、应用场景和独特特点四个方面来详细解析，为什么这个开源项目应该成为你下一个项目的得力助手。原创 2024-10-17 12:17:51 · 563 阅读 · 0 评论 -
Bootstrap 弹出框（Popover）插件
弹出框（Popover）与工具提示（Tooltip）类似，提供了一个扩展的视图。如需激活弹出框，用户只需把鼠标悬停在元素上即可。弹出框的内容完全可使用 Bootstrap 数据 API（Bootstrap Data API）来填充。该方法依赖于工具提示（tooltip）。原创 2024-10-17 10:39:50 · 311 阅读 · 0 评论 -
CSS3 提示框带边角popover
CSS3 提示框带边角popover，CSS3 提示框带边角popover。因为需要绝对定位子元素（这里就是伪元素），所以需要将其设置为相对对位原创 2024-10-17 10:01:41 · 374 阅读 · 0 评论 -
CSS宽度100％和宽度100vw之间有什么不同？
使用 vw 作为网站中所有内容（包括字体大小和高度）的单位，无论分辨率如何，网站始终与设备的屏幕宽度成比例显示。这使得确保您的网站在工作站和移动设备上显示完全相同变得非常容易。您可以在您的 body CSS 和 中指定的所有内容中设置 font-size: 1vw （或适合您的项目的任何大小） rem 设备将根据屏幕自动缩放很容易将现有项目甚至框架（例如已经使用 rem 作为一切单元的 Bootstrap）移植到这个概念。原创 2023-10-29 00:24:37 · 2460 阅读 · 0 评论 -
Bootstrap中CSS媒体查询分辨率 @media（min-width）例子
Bootstrap中CSS媒体查询分辨率 @media（min-width）例子原创 2023-10-26 17:36:11 · 653 阅读 · 0 评论 -
Bootstrap 中CSS媒体查询分辨率 @media（min-width）
媒体查询是非常别致的"有条件的 CSS 规则"。它只适用于一些基于某些规定条件的 CSS。如果满足那些条件，则应用相应的样式。原创 2023-10-26 17:34:26 · 889 阅读 · 0 评论 -
hls.js如何播放m3u8文件（实例）？
hls.js如何播放m3u8文件，附一个例子，hls.js如何播放m3u8文件，附一个例子。HLS（HTTP Live Streaming）是一种视频流传输协议，是苹果推出的适用于iOS与macOS平台的流媒体传输协议。它将视频分割成若干个小段，每个小段大小一般为2~10秒不等，并通过HTTP协议进行传输。通过在每个小段之间插入若干秒的间隔，可以提高视频的传输稳定性和用户的观看体验。HLS协议不断取回流数据，平衡延迟与流畅度，能够适应不同带宽以及设备的变化，保证了视频在不同网络环境下的稳定播放，是现在移动互原创 2023-03-03 10:03:59 · 4473 阅读 · 0 评论 -
html5支持的几种音频格式介绍
abort：当音频/视频的加载已放弃时 canplay：当浏览器可以播放音频/视频时 canplaythrough：当浏览器可在不因缓冲而停顿的情况下进行播放时 durationchange：当音频/视频的时长已更改时 emptied：当目前的播放列表为空时 ended原创 2023-01-10 09:16:33 · 1422 阅读 · 0 评论 -
CSS网页页面图像灰色滤镜写法示例
CSS网页页面图像灰色滤镜写法示例，此函数接受包含灰度值的单个参数量。灰度值根据数量和百分比设置。值0％表示原始图像，而值0％至100％之间的值表示效果的线性乘数。原创 2022-12-01 09:47:58 · 1774 阅读 · 0 评论 -
网页iframe框架常见的应用例子
网页iframe框架常见的应用例子，网页iframe框架常见的调用例子原创 2022-02-22 09:31:53 · 2279 阅读 · 0 评论 -
CSS使用border-radius指定每个圆角的大小
CSS使用border-radius指定每个圆角的大小，如果你在 border-radius 属性中只指定一个值，那么将生成 4 个 圆角。原创 2021-11-26 10:32:53 · 902 阅读 · 1 评论 -
如何用CSS判断手机、平板、PC终端？
<style> /*手机*/ @media screen and (max-width:600px){ .box_2 { padding-top: 45px; padding-bottom: 50px; /* background: #fff; */ /* 添加背景图片 */ b.原创 2021-09-03 11:11:50 · 8174 阅读 · 0 评论 -
层固定方法（position:fixed）
层固定方法（position:fixed）<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"&g...原创 2020-01-09 08:48:10 · 499 阅读 · 0 评论 -
CSS之transform用法的困惑
div{transform:rotate(7deg);-ms-transform:rotate(7deg); /* IE 9 */-moz-transform:rotate(7deg); /* Firefox */-webkit-transform:rotate(7deg); /* Safari 和 Chrome */-o-transform:rotate(7deg); /* ...原创 2019-11-16 13:15:10 · 245 阅读 · 0 评论 -
css3上下左右渐变效果，很酷，很强大
css3上下左右渐变效果，很酷，很强大<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>CSS 渐变</title> <style> /* 线性渐变 */ #...原创 2019-11-04 11:54:42 · 7986 阅读 · 2 评论 -
css实现文本上下具中的示例源代码
css实现文本上下具中的示例源代码//单行居中<div class="wapper"> <p class="child">酷播云 助力企业视频轻松上云</p></div>//多行居中<div class="wapper"> <div class="child"> <p>酷...原创 2019-10-28 09:44:55 · 260 阅读 · 0 评论 -
css3中vw/vh/vmin/vmax的含义与使用方法
css中的一些其他单位补充在前面：in：英寸cm：厘米mm：毫米ex：一个 ex 是一个字体的 x-height。 (x-height 通常是字体尺寸的一半,在无法确定x-height 的情况下以0.5em计算)pt：磅 (1 pt 等于 1/72 英寸)pc：12 点活字 (1 pc 等于 12 点)ch:以节点所使用字体中的“0”字符为基准。找不到...转载 2018-11-27 14:49:05 · 4014 阅读 · 0 评论 -
腾讯技术指南：H5同层播放器接入规范
（提示：该指南只适用腾讯系产品）H5同层播放器接入规范x5-video-player-type 启用Ｈ5同层播放器通过video属性“x5-video-player-type”声明启用同层H5播放器x5-video-player-type支持的值类型：h5示例：<video src="http://xxx.mp4" x5-video-player-type="h5"/...转载 2018-12-03 09:42:48 · 1132 阅读 · 0 评论 -
HTML5之Video对象属性和方法（html5播放器设计必须研究的）
准备研究下html5视频播放器，html5音视频播放器开发设计必须研究的东东，整理出来，会用到的。阿酷。。。。Video实例<video src="movie.ogg" controls="controls">您的浏览器不支持 video 标签。</video>浏览器支持注释：Internet Explorer 8 以及更早的版本不支持 <vid...原创 2018-11-19 23:36:27 · 3831 阅读 · 0 评论 -
QQ浏览器劫持html5的视频video标签的问题（怎么解决？）
无解，暂无解决办法，哪位朋友知道告之一下，感激QQ浏览器真的不讲一点规则，强制劫持视频video标签，这已经很 XX 了吧？还在视频结束时加载他们自己的广告，这... 就无语了。相信开发html5视频播放器的朋友，都会遇到这个问题。参见：腾讯的移动浏览器劫持 <Video> 换成它自己的播放器还插广告： https://www.v2ex.com/t/411564...原创 2018-12-12 11:21:10 · 16975 阅读 · 10 评论 -
谷歌chrome 71 flash 添加问题的解决方案（chrome禁用添加允许flash的选项）
谷歌chrome 71 flash 添加问题的解决方案（chrome禁用添加允许flash的选项）谷歌chrome 71版本已不再允许添加支持flash的站点了，注意是禁用了，没有添加的选项了；即便你允许某个站点的flash播放，也在退出浏览器后，会清除掉记录，意味着你下次打开同一个站点，又得重新操作了。对于测试人员和一些常用到flash的人员来说，这就抓狂了！下面说说如何解决这样的问题吧...原创 2018-12-12 12:21:13 · 9768 阅读 · 1 评论 -
通过 CSS3 创建圆角边框和向矩形添加阴影
通过 CSS3，您能够创建圆角边框，向矩形添加阴影，使用图片来绘制边框 - 并且不需使用设计软件，比如 PhotoShop。在本章中，您将学到以下边框属性：border-radius box-shadow border-image浏览器支持属性 浏览器支持 border-radius box-shadow ...原创 2019-01-17 16:51:57 · 557 阅读 · 0 评论 -
css3媒体查询@media在响应式web设计中的应用
阿酷TONY 原创文章 关键词：媒体查询、css3媒体查询、css3@media2019-2-12css3媒体查询@media在响应式web设计中的应用调用方式1：<link rel="stylesheet" href="style.css" media="screen and (min-width: 768px)">注：media="screen and (...原创 2019-02-12 19:01:42 · 335 阅读 · 0 评论 -
html5的页面放到服务器video标签不播放
<div class="video"><video src="video/顺丰物流仿真案例演示.mp4" controls="controls" autoplay="autoplay" width="100%"poster="images/video-default.png"> 请更新您的浏览器&...转载 2019-06-14 12:03:52 · 1613 阅读 · 1 评论 -
jQuery的animate.min.css的使用方法与演示
1、首先引入animate css文件 1 2 3 <head> <linkrel="stylesheet"href="animate.min.css"> </head> 2、给指定的元素加上指定的动画样式名 1 <divclass="an...原创 2019-08-13 18:54:53 · 685 阅读 · 0 评论 -
html5的video标签实现对HLS(m3u8格式)的支持（附代码实例）
html5的video标签实现对HLS(m3u8格式)的支持（附代码实例）<script src="https://cdn.jsdelivr.net/hls.js/latest/hls.min.js"></script><video id="video"></video><script> if(Hls.isSuppo转载 2018-11-29 10:35:39 · 32728 阅读 · 2 评论