1、代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>四角边框</title> <style> body{ display: flex; flex-direction: row; justify-content:
原创
2022-09-27 11:49:37
1041阅读
- 1、用dom元素遮挡，想挡几个挡几个，这个就不说了。 2、用css3渐变背景： background-image: linear-gradient(direction, color-stop1, color-stop2, ...); direction：用角度值指定渐变的方向（或角度）。 col ...
转载
2021-10-25 23:07:00
1429阅读
2评论
CSS3圆角边框实例：<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>CSS3圆角边框</title>
<style>
div{
text-align:center;
border:2px 
原创
2015-10-15 14:25:33
786阅读
今天用CSS写一个缺角的div，大致的效果是这样的，div的左上角和右上角缺掉了一块的效果，简称为缺角div<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <title...
原创
2022-04-23 22:38:19
478阅读
点赞
今天用CSS写一个缺角的div，大致的效果是这样的，div的左上角和右上角缺掉了一块的效果，简称为缺角div<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <title...
原创
2021-07-28 11:38:26
711阅读
1、html <div class="loginbody"> <div class="border_corner border_corner_left_top"></div> <div class="border_corner border_corner_right_top"></div> <div ...
转载
2021-10-14 11:48:00
2355阅读
2评论
在前端有一句古话，叫能用CSS实现的就别麻烦JS，因为声明式的配置语言CSS相比于自由式的编程语言JS，更容易被编译器所优化，比如css渲染引擎会优先考虑gpu加速，因此CSS动画的性能往往高于JS动画，本文介绍在不需要html和js的配合的情况下，用纯css实现一个好看的四角边框。用最节能的代码实现如图所示的，在大数据报表中非常常见的四角边框，有点类似Unicode中的制表符和直角括号：⌜ ⌝
原创
2022-01-11 15:08:56
656阅读
css边框并不是一个矩形。看下面的代码：
<html> <head> <style type="text/css"> &n
原创
2013-05-05 19:38:28
675阅读
在前端有一句古话，叫能用CSS实现的就别麻烦JS，因为声明式的配置语言CSS相比于自由式的编程语言JS，更容易被编译器所优化，比如css渲染引擎会优先考虑gpu加速，因此CSS动画的性能往...
原创
2021-12-10 13:50:23
2723阅读
说实话 CSS 真的就是一个魔术师，能把老套的东西变的很好看，真的像极了魔术师，突然去看深圳有什么免费的山爬的文章了，然后突然发现一个人，就不想去爬山了，一个真的无聊的要死了，离谱死了我自己。然后继续发呆继续发呆继续发呆https://mp.weixin.qq.com/s/DG2_gWYVlIuFybSJGrqvXQ牛逼的ai4.多才想起来我还在写文章。。。边框就是边的框框hhhh，把盒子看成相框
原创
2023-04-17 18:29:28
821阅读
HTML：<p class="tooltip">定义：连接设备的用户数<br>当前：正在连接设备的用户数<br>今日：到
原创
2022-07-20 06:19:17
597阅读
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 strick//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> New Document </title>
<meta name="Generator
原创
2014-03-18 09:49:32
1783阅读
简述在前面，我们分享过关于三角的实现方式，主要根据border属性来设置，下面我们来实现上、下、左、右各种不同颜色的三角。简述实现效果源码实现效果源码<!DOCTYPE html><html><head><style type='text/css'>/* 上三角 */.arrow-up { width: 0; height: 0; border-left: 20px so
原创
2022-07-29 11:26:31
179阅读
最近有个小伙伴问我，在某个网站看到一个使用 SVG 实现的炫彩三角边框动画，问能否使用 CSS 实现： 很有意思的一个动画效果，立马让我想起了我在 CSS 奇思妙想边框动画 一文中介绍的边框动画，非常的类似： 其核心就是利用了角向渐变（conic-gradient），然后将图案的中心区域通过覆盖遮罩
原创
2022-04-30 21:35:26
549阅读
绘制一个圆角边框的示例.div{ border: solid 5px blue; border-radius: 20px; -moz-border-radius:20px; -o-border-radius: 20px; -webkit-border-radius:20px; backg...
原创
2021-07-30 14:53:37
348阅读
大家好，这里是「 从零开始学 Web 系列教程 」，并在下列地址同步更新......github：https://github.com/Daotin/Web
在这里我会从 Web 前端零基础开始，一步步学习 Web 相关的知识点，期间也会分享一些好玩的项目。现在就让我们一起进入 Web 前端学习的冒险之旅吧！一、颜色模式颜色模式有两种：RGBArgba(0,0,0,0.5); //黑色，透明度0.
转载
2024-07-25 10:05:04
156阅读
实例一： 实现的效果如下图： 实例二： 实现的效果如下图：
转载
2019-06-20 21:53:00
454阅读
2评论
效果：代码：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title
原创
2022-10-28 08:45:45
857阅读
