html css制作404页面,CSS3绘制404页面

html css制作404页面,CSS3绘制404页面标题有点噱了…最近在做一个交通有关的项目,想做一个类似标志牌的404,所以就有了这个.只用的CSS3中的旋转,效果如下上代码:Error.circle{width:200px;height:200px;border-radius:200px;border:15pxsolid#B22727;}.circle>div{color:#B22727;font:bol…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

标题有点噱了…

最近在做一个交通有关的项目, 想做一个类似标志牌的404, 所以就有了这个.

只用的CSS3中的旋转, 效果如下

dbdfea3befa35a77c3137366b220f186.png

上代码:

Error

.circle {

width: 200px;

height: 200px;

border-radius: 200px;

border: 15px solid #B22727;

}

.circle > div {

color: #B22727;

font: bolder 50px arial;

transform: matrix(0.642788,-0.766044,0.766044,0.642788,0,95);

-ms-transform: matrix(0.642788,-0.766044,0.766044,0.642788,0,95);

-moz-transform: matrix(0.642788,-0.766044,0.766044,0.642788,0,95);

-o-transform: matrix(0.642788,-0.766044,0.766044,0.642788,0,95);

position: absolute;

top: 0;

left: 0;

}

.block {

width: 60px;

display: inline-block;

height: 15px;

background-color: #B22727;

margin: 12px 10px;

}

404

兼容IE9+ 及其他, 主要是 transform 的兼容问题, 以下来自这里:

Internet Explorer 10、Firefox 以及 Opera 支持 transform 属性。

Chrome 和 Safari 需要前缀 -webkit-。

Internet Explorer 9 需要前缀 -ms-。

虽然除了 transform, 还有其他可以玩的, 像圆角, 404两边的条, 但是觉得效果这个东西, 还是不要炫技术的好.

本来不想上传效果图的, 弄了弄发现css写css代码会被注释掉, 诶 申请个js权限去

一款纯css3实现的漂亮的404页面

之前为大家分享了那些创意有趣的404页面, html5和css3打造一款创意404页面, HTML5可爱的404页面动画很逗的机器人.今天再给大家分享一款纯css3实现的漂亮的404页面.效果图如下: …

html5和css3打造一款创意404页面

之前和网友分享一款HTML5可爱的404页面动画 很逗的机器人.今天要爱编程小编要再给大家带来一款html5和css3打造的创意404页面.一起看下效果图吧: 在线预览   源码下载 实现的代码. h …

jQuery+CSS3实现404背景动画特效

效果:http://hovertree.com/texiao/jquery/74/ 源码下载:http://hovertree.com/h/bjaf/ko0gcgw5.htm 效果图如下: 代码如下: …

CSS3绘制六边形

因为很简单,所以先总结一下:使用CSS3绘制六边形主要使用伪类:before和:after在源元素之前和之后再绘制两个元素,并利用css3的边框样式,将这两个元素变成三角形放置在源元素的两端即可. ( …

【项目1-1】使用HTML5+CSS3绘制HTML5的logo

作为一个WEB小萌新,自学了有一段时间,总是感觉停滞不前.最近反思中,想到前贤一句话:书读百遍其义自见.说到底,还是项目做的少,如果做多了,想必自然会得心应手. 利用HTML5+CSS3绘制HTML5 …

CSS3制作404立体字体

CSS3制作404立体字体页面效果     鼠标移动上去,背景色变白.       动态效果:     .demo p:first-child span:hover { text-shadow:0px …

thinkphp访问不存在的模块或者方法跳转到404页面

使用的thinkphp 版本是3.2.0, 在config.php中配置 404地址,即可: ‘TMPL_EXCEPTION_FILE’ => ‘./Application/Home/View/ …

网站设置404页面 –nginx

有的时候根据域名要先知道用的什么web 服务器 最简单的 http://tool.chinaz.com/pagestatus/  输入域名,看返回的头部信息 用的那个web浏览器 下面的方法也是根据头 …

JavaWeb 自定义404页面

本来,Tomcat中自定义404页面不过是在web.xml文件中写4行代码的事情. 直接引用 Tomcat官方FAQ 怎样自定义404页面? 编辑web.xml …

随机推荐

VB将JSON映射到表格实现解析

现在抓取网页数据的时候,经常会遇到JSON的数据,相对于繁杂无标签名的HTML源,用JSON传回的数据比较直观好看点.但是从其中提炼数据也让人觉得很烦躁,基本上就是不断的查找,截取,或者组装成JS代码 …

为什么静态成员、静态方法中不能用this和super关键字

1.      在静态方法中是不能使用this预定义对象引用的,即使其后边所操作的也是静态成员也不行. 因为this代表的是调用这个函数的对象的引用,而静态方法是属于类的,不属于对象,静态方法成功加载 …

Space and GridLayout 教程

Ice Cream Sandwich (ICS) sports two new widgets that have been designed to support the richer user i …

以下是jQuery和JavaScript实现相同操作的等价代码。

选择元素  Javascript代码 1.// jQuery   2.var els = $(‘.el’);   3.  4.// 原生方法   5.var els = document.queryS …

融云(找到“每个App都有沟通的需求”的细分市场)

近日,国内著名App驾考宝典和融云达成合作,为应用增加IM功能,实现亿级用户之间聊天.消息一出,IM(即时通讯)领域的大佬,同时也是个上线不到两岁的新生力量,再次引发了行业的关注. 对业内人士而言,即 …

安装Postgresql踩过的坑

PG安装相关的 1  系统语言的设置 PG的安装,和系统的locale设置有一定的关系,需要设置,如在.profile或.bashrc中 也可以运行下面的命令: dpkg-reconfigure lo …

STL—对象的构造与析构

STL内存空间的配置/释放与对象内容的构造/析构,是分开进行的.   对象的构造.析构         对象的构造由construct函数完成,该函数内部调用定位new运算符,在指定的内存位置构造对象 …

hdu5904 LCIS

这题惩罚我这种经常不管常数的懒人 直接 1e6 TLE 如果1e5对数组枚举过 诶其实很想吐槽些伤心事,但是还是不想在博客上吐口水 不管今年比赛结果如何 请享受比赛 #include

十个 PHP 开发者最容易犯的错误

PHP 语言让 WEB 端程序设计变得简单,这也是它能流行起来的原因.但也是因为它的简单,PHP 也慢慢发展成一个相对复杂的语言,层出不穷的框架,各种语言特性和版本差异都时常让搞的我们头大,不得不浪费 …

记一个逻辑bug

1     从数据库中找出一个学生能选的毕业设计(毕设的select or not 字段表示本题目是否已经被选 此时就按照其值为n来查询) 2     用户选择某个毕设后,先更新毕设表(select …

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/164556.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • LR模型详解_GARCH模型

    LR模型详解_GARCH模型1、逻辑回归逻辑回归假设数据服从伯努利分布,通过极大化似然函数方法,运用梯度下降来求解参数,来达到将数据二分目的。2、算法推导对数几率函数:是一种Sigmoid函数,通过此函数来输出类别概率。对数几率函数为:,其中y代表的是样本视为正样本的可能性,则1-y为视为负样本的可能性。对数几率:定义为,其中y/(1-y)称为比率。决策边界:作用在n维空间,将不同样本分开的平面或曲面,在逻辑回归中,决策边界对应$wx+b=0。3、逻辑参数估计3.1、使用极大似…

    2022年10月13日
    3
  • C#中如何使用Parallel.For和Parallel.ForEach[通俗易懂]

    C#中如何使用Parallel.For和Parallel.ForEach[通俗易懂]如何在C#中使用Parallel.For和Parallel.ForEach利用C#中的无锁,线程安全的实现来最大化.NET或.NETCore应用程序的吞吐量。并行是在具有多个内核的系统上并行执行任务的能力。.NETFramework4中引入了对.NET中并行编程的支持。.NET中的并行编程使我们能够更有效地使用系统资源,并具有更好的编程控制能力。本文讨论了如何在.NETCore应用程序中使用并行性。若要使用本文提供的代码示例,您应该在系统中安装VisualStudio2019。在Visu

    2022年7月19日
    11
  • 游戏场景建模用什么软件?

    游戏场景建模用什么软件?游戏场景建模用什么软件?想要入行游戏领域第一步大家要知道建模要用到的软件“ZBrush”“3DMax”“MAYA”ZBrush:高模的制作软件,用ZB做角色是很很好的,可是难度系数也挺大,平常要多看看人体的构造,或找人体写真来把控不一样的人体肌肉转变,多了解多实践。3DMax:3DMax相对而言是一个较为简单易学的软件,用于做建筑场景也很的好使。可是3D要想把他学精依然要1个步骤的,因此掌握软件很重要,3D建模的软件物品很杂很碎,还需多练才最重要,多做一些实例熟记的也差不多了。MAYA:熟记人

    2022年5月19日
    42
  • 目标检测——SPPNet【含全网最全翻译】「建议收藏」

    目标检测——SPPNet【含全网最全翻译】「建议收藏」文章目录0.摘要1.简介2.基于空间金字塔池化的深度网络2.1卷积层和特征图2.2空间金字塔池化层2.3网络的训练2.3.1单一尺寸训练2.3.2多尺寸训练3.用于图像分类的SPP-NET3.1ImageNet2012分类实验3.1.1基准网络架构3.1.2多层次池化提升准确度3.1.3多尺寸训练提升准确度3.1.4全图像表示提升准确度3.1.5特征图上的多视图测试…

    2022年4月28日
    45
  • 数据库的or语句_oracle数据库常用sql语句

    数据库的or语句_oracle数据库常用sql语句一、ORACLE的启动和关闭1、在单机环境下要想启动或关闭ORACLE系统必须首先切换到ORACLE用户,如下su-oraclea、启动ORACLE系统oracle>svrmgrlSVRMGR>connectinternalSVRMGR>startupSVRMGR>quitb、关闭ORACLE系统oracle>svrmgrlSVRMGR&g…

    2025年6月7日
    4
  • tomcat会自动解压war包吗_tomcat war包不解压

    tomcat会自动解压war包吗_tomcat war包不解压推荐文章概述:本文介绍web开发中的项目更新,项目与war方式更新1cd到tomcat的bin目录,执行./shutdown.sh。仍有可能该进程未被关闭,重启会出现问题。2查看运行中的java进程#ps-ef|grepjava推荐文章转自:http://www.cnblogs.com/fatsnake/p/5631785.html将war包拷贝到tomcatwebapps目录下时,如…

    2022年10月4日
    4

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号