css炫酷标题,分享几个CSS小众但炫酷的技巧

2023-11-17

1. 黑白图像

这段代码会让你的彩色照片显示为黑白照片,是不是很酷?

复制代码代码如下:

img.desaturate {

filter: grayscale(100%);

-webkit-filter: grayscale(100%);

-moz-filter: grayscale(100%);

-ms-filter: grayscale(100%);

-o-filter: grayscale(100%);

}

2.页面顶部阴影

下面这个简单的 css3 代码片段可以给网页加上漂亮的顶部阴影效果:

复制代码代码如下:

body:before {

content: "";

position: fixed;

top: -10px;

left: 0;

width: 100%;

height: 10px;

-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,.8);

-moz-box-shadow: 0px 0px 10px rgba(0,0,0,.8);

box-shadow: 0px 0px 10px rgba(0,0,0,.8);

z-index: 100;

}

3.所有一切都垂直居中

要将所有元素垂直居中,太简单了:

复制代码代码如下:

html, body {

height: 100%;

margin: 0;

}

body {

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

css炫酷标题,分享几个CSS小众但炫酷的技巧 的相关文章

  • dos磁盘管理命令

    dos磁盘管理命令 前言 磁盘管理命令用于日常的磁盘维护 DOS命令行提供了多种文件管理命令用于设置和管理磁盘列表 由于很多磁盘在没有安装图形界面的时候就需要对其进行操作 所以掌握DOS命令行下的磁盘管 理命令对系统管理员是十分必要的 磁盘
  • 区域气象-大气化学在线耦合模式(WRF/Chem)在大气环境领域实践技术应用

    大气污染是工农业生产 生活 交通 城市化等方面人为活动的综合结果 同时气象因素是控制大气污染的关键自然因素 大气污染问题既是局部 当地的 也是区域的 甚至是全球的 本地的污染物排放除了对当地造成严重影响外 同时还会在动力输送作用下 极大地影
  • 【小程序】解析小程序原理

    本文首发自 前端修罗场 一个专注 Web 技术 答疑解惑 面试辅导 职业发展的社区 实际学习过程中 有些同学常常会对小程序和 Web 应用之间的差别产生疑惑 它们之间到底有什么不同 Web 应用不能作为小程序吗 本期文章将会带你比较小程序和
  • JS如何判断是否为null、undefined、NaN

    判断null var exp null if exp typeof exp undefined exp 0 alert is null typeof exp undefined 排除了 undefined exp 0 排除了数字零和 fal
  • 【观影笔记】地平线:大数据时代(BBC)

    地平线 大数据时代 BBC 影片中的实例 大数据分析所需要素 感悟 影片中的实例 洛杉矶 利用预测地震余震发生的模型来预测犯罪 数据挖掘起源 约翰 格兰特Graunt 伦敦黑死病死亡记录 Phil Beales 基因生物学寻找疾病治疗方法
  • PostgreSQL 基本安装总结

    一 Mac 环境下的安装 brew install postgresql 1 1 查看当前环境版本 pg ctl V 1 2 初始化数据库 在开始使用数据库前 需要在磁盘上初始化一个数据库存储区域 通常称之为一个数据库集簇 SQL标准使用的
  • fastjson 问题

    问题 1 fastjson value 为null key 会丢失问题 2 SerializerFeature 配置参数 背景 和第三方系统进行对接 两边商量好了接口定义 有些是非必填项 从数据库查询出来的数据赋值给相应的key 有些Str
  • 会议是浪费工作时间的最佳去处

    本文为翻译初稿 更多精彩内容 敬请关注 高效能程序员的修炼 人民邮电出版社 今天你开了多少个会 这个星期呢 这个月呢 现在你再自问一下 那些会议中有多少是值得参加的 如果把相同的时间用在工作上 你又能完成多少事情 这不禁让人想知道 我们究竟
  • 【设计模式

    every blog every motto You can do more than you think https blog csdn net weixin 39190382 type blog 0 前言 设计模式 上 创建型 设计模式
  • 基于51单片机无线NRF24L01的温湿度光照采集

    接收端 原理图 发送端 原理图 实物焊接图 主端源程序 发送端程序 从机NRF24L01程序 ifndef API DEF define API DEF Define interface to nRF24L01 Define SPI pin
  • cJSON介绍与应用—基于VS以及STM32单片机

    一 cJSON介绍 cJSON是一个使用C语言编写的JSON数据解析器 具有超轻便 可移植 单文件的特点 使用MIT开源协议 cJSON的源码文件只有两个 1 cJSON h 2 cJSON c 使用的时候 只需要将这两个文件复制到工程目录
  • 数据仓库是什么?和数据库有何区别?

    在具体学习数据仓库之前先看一下数据中心的整体构架以及数据流向 DB 是现有的数据来源 可以为mysql SQLserver 文件日志等 为数据仓库提供数据来源的一般存在于现有的业务系统之中 ETL 是 Extract Transform L
  • Doxygen 详细使用

    doxygen的安装和基本使用可参考 Doxygen的安装和基本使用 常用选项 doxygen的所有选项的参考文档 doxygen官网文档 2 样式说明 doxygen可以自己自定义样式 手写 css文件 可以查看doxygen的源码 进行
  • 激光雷达LMS111在ROS上的使用

    LMS111 10100 在ROS上的测试与使用 准备工作 设备 硬件 LMS111 101000激光雷达 软件 ubuntu16 04 ROS 开始 设备连接 将激光雷达与处理器 电脑 工控机等 通过以太网连接好 激光雷达默认的IP地址为
  • Pytorch学习笔记(I)——预训练模型(三):VGG11网络结构

    VGG VGG11 VGG13 VGG16 VGG19 ResNet ResNet18 ResNet34 ResNet50 ResNet101 ResNet152 VGG features Sequential 0 Conv2d 3 64
  • Matlab神经网络训练函数train

    0 前言 本文基于MatlabR2009a分享神经网络的训练过程 1 启动训练 在Matlab中使用train函数对神经网络进行训练的时候 会弹出以下窗体 图1 1 由上图中的Netrual Network项可见 这是一个两层的网络 2 算
  • 适合Python入门的5本基础书籍

    Python 3标准库 对程序员而言 标准库与语言本身同样重要 它好比一个百宝箱 能为各种常见的任务提供完美的解决方案 所以本书是所有Python程序员都必备的工具书 全书以案例驱动的方式讲解了标准库中数百个模块的使用方法 如何工作 和工作
  • Java Web 远程调试

    Java Web 远程 调试 Tomcat 下载压缩版服务器 环境 Tomcat Eclipse 做远程调试我们并不需要其他特殊插件 1 配置Tomcat bin startup bat 在前面增加代码 SET CATALINA OPTS
  • linux三剑客awk命令详解之函数

    awk函数 在awk命令中 可以自定义函数 awk也有内置的函数 本篇文章主要介绍awk中的内置函数 awk内置函数分类 在awk中 内置函数主要分为算数函数 字符串函数 时间函数 其他函数等 以下列出一些常用的内置函数 算数函数 常用的主

随机推荐

  • html无法导入,如何修复“ImportError:无法导入名称'HTMLParseError'”?

    我正在尝试导入BeautifulGroup 但运行脚本时遇到错误 Traceback most recent call last File LinkCrawler py line 5 in from bs4 import Beautiful
  • CH9-网络编程

    案例9 2 模拟微信聊天 案例介绍 1 案例描述 在如今 微信聊天已经人们生活中必不可少的重要组成部分 人们的交流很多都是通过微信来进行的 本案例要求 将多线程与UDP通信相关知识结合 模拟实现微信聊天小程序 通过监听指定的端口号 目标IP
  • matlab模糊控制工具箱使用和模糊控制pid实例参考

    Matlab模糊控制工具箱为模糊控制器的设计提供了一种非常便捷的途径 通过它我们不需要进行复杂的模糊化 模糊推理及反模糊化运算 只需要设定相应参数 就可以很快得到我们所需要的控制器 而且修改也非常方便 下面将根据模糊控制器设计步骤 一步步利
  • 4-2 背包问题(贪心)

    4 2 背包问题 贪心 与0 1背包问题类似 所不同的只是在选择物品i装入背包时 可以选择物品的一部分而不一定要全部 1 i n 用贪心算法解背包问题的基本步骤是 首先计算每种物品单位重量的价值vi wi 然后 依贪心选择策略 将尽可能多的
  • html css 粗略浏览笔记

    1 HTML 不是一种编程语言 而是一种标记语言 元素是 HTML 页面的根元素 HTML 链接是通过标签 来定义的 HTML 图像是通过标签 来定义的 换行 br HTML 元素可以设置属性 属性总是以名称 值对的形式出现 比如 name
  • idea+sbt

    1 idea新建sbt scala项目 https blog csdn net aliceyangxi1987 article details 76423334 2 自己下载sbt集成到idea项目里 https www cnblogs c
  • LeetCode-1325. Delete Leaves With a Given Value

    Given a binary tree root and an integer target delete all the leaf nodes with value target Note that once you delete a l
  • Linux安装oracle 19C

    一 下载软件 我这边下的是ZIP Linux x86 64 二 安装依赖 yum install compat libcapl elfutils libelf devel fontconfig devel gliba devel kshli
  • Windows 10使用WSL部署Chatgpt_academic

    目录 一 在windows10中安装Ubuntu系统 二 在Ubuntu系统中安装anaconda3和GPT Academic 本文主要介绍windows10使用WSL安装Ubuntu系统 然后通过安装anaconda3来部署chatgpt
  • Unity——虚拟轴

    1 虚拟轴的概念 简单来说 虚拟轴就是一个数值在之间的数轴 其中最重要的数值为 1 0 1 2 虚拟轴的模拟 以按键模拟为例 用按键模拟虚拟轴需要2个按键 一个为负轴按键 按键1 一个为正轴按键 按键2 在没有按下任何按键的时候 虚拟轴的数
  • NRF52832学习笔记(1)—— 添加自有service(基于SDK15.3)

    前言 SDK版本15 3 评估板 pca10040 在uart的例程中添加battery service 添加之前 手机连上设备之后扫描到的service如下 一 分配ram空间 softdevice的flash code是确定 但ram是
  • WIKIOI – 1083 Cantor表

    题目描述 Description 现代数学的著名证明之一是Georg Cantor证明了有理数是可枚举的 他是用下面这一张表来证明这一命题的 1 1 1 2 1 3 1 4 1 5 2 1 2 2 2 3 2 4 3 1 3 2 3 3 4
  • 2021上半年

    转眼间 2021年已经过去了一半 按照记账惯例 每逢月底 要对当月的财务状况进行结算 6月的话 还要再额外增加一轮年中结算 同时 受到近期一系列调整的影响 记录表也相应进行比较大的变更 以适应复杂度的增加 以至于 例行结算迟了两天才完成 但
  • 【matplotlib】AttributeError: Unknown property figsize

    AttributeError Unknown property figsize 属性错误 未知属性figsize 原代码 var YearBuilt data pd concat df train SalePrice df train va
  • Kafka【命令行操作】

    Kafka 命令行操作 Kafka 主要包括三大部分 生产者 主题分区节点 消费者 1 Topic 命令行操作 也就是我们 kafka 下的脚本 kafka topics sh 的相关操作 常用命令行操作 参数 描述 bootstrap s
  • Java中的IO流系统详解

    摘要 Java 流在处理上分为字符流和字节流 字符流处理的单元为 2 个字节的 Unicode 字符 分别操作字符 字符数组或字符串 而字节流处理单元为 1 个字节 操作字节和字节数组 Java 内用 Unicode 编码存储字符 字符流处
  • 【网络】——UDP复习笔记

    目录 1 UDP报文结构 2 UDP缓冲区 3 UDP特点 4 课后题 1 UDP报文结构 2 UDP缓冲区 UDP没有真正意义上的发送缓冲区 应用层调用sendto 函数直接将数据应用层的数据拷贝给传输层 传输层再构建UDP报头 然后再交
  • VMware——VMware Tools的介绍及安装方法

    VMware VMware Tools的介绍及安装方法 一 VMware Tools的作用 二 VMware Tools的安装步骤 参考文章 一 VMware Tools的作用 1 最大的好处是可以直接把windows界面的文件拖进linu
  • 【前端Vue】Element UI:一站式前端组件库的简单入门指南

    Element UI 一站式前端组件库的完整指南 引言 Element UI概述 常用组件介绍及用法 结语 引言 在现代的前端开发中 UI组件库扮演着至关重要的角色 它们为开发者提供了一套可重用的UI组件和工具 使得构建复杂的用户界面变得更
  • css炫酷标题,分享几个CSS小众但炫酷的技巧

    1 黑白图像 这段代码会让你的彩色照片显示为黑白照片 是不是很酷 复制代码代码如下 img desaturate filter grayscale 100 webkit filter grayscale 100 moz filter gra