CSS实现文字凹凸效果

  1. 使用两个div分别用来实现凹凸效果;
  2. text-shadow语法
    text-shadow: h-shadow v-shadow blur color;
    h-shadow:必需。水平阴影的位置。允许负值。
    v-shadow :必需。垂直阴影的位置。允许负值。
    blur:可选,模糊的距离。
    color:可选,阴影的颜色。
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>文字效果</title>
    <style>
        body {
            background-color: #ccc;
        }
        div {
            color: #ccc;
            font: 700 80px "微软雅黑";
        }
        div:first-child {
            text-shadow: 1px 1px 1px #000, 
                -1px -1px 1px #fff;
        }
        div:last-child {
            text-shadow: -1px -1px 1px #000, 
                1px 1px 1px #fff;
        }
    </style>
</head>
<body>
    <div>
        曾经沧海难为水
    </div>
    <div>
        除却巫山不是云 
    </div>
</body>
</html>

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/2002.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【C语言】你真的了解结构体吗

引言✨我们知道C语言中存在着整形(int、short...)&#xff0c;字符型(char)&#xff0c;浮点型(float、double)等等内置类型&#xff0c;但是有时候&#xff0c;这些内置类型并不能解决我们的需求&#xff0c;因为我们无法用这些单一的内置类型来描述一些复杂的对象&#xff0c…

k8s部署prometheus

k8s部署prometheus 版本说明&#xff1a; k8s&#xff1a;1.24.4 prometheus&#xff1a;release-0.12&#xff08;https://github.com/prometheus-operator/kube-prometheus.git&#xff09; 本次部署采用operator的方式将prometheus部署到k8s中&#xff0c;需对k8s和prom…

springboot+vue驾校管理系统 idea科目一四预约考试,练车

加大了对从事道路运输经营活动驾驶员的培训管理力度&#xff0c;但在实际的管理过程中&#xff0c;仍然存在以下问题&#xff1a;(1)管理部门内部人员在实际管理过程中存在人情管理&#xff0c;不进行培训、考试直接进行发证。(2)从业驾驶员培训机构不能严格执行管理部门的大纲…

SpringBoot解析指定Yaml配置文件

再来个文章目录 文章目录前言1、自定义配置文件2、配置对象类3、YamlPropertiesSourceFactory下面还有投票&#xff0c;帮忙投个票&#x1f44d; 前言 最近在看某个开源项目代码并准备参与其中&#xff0c;代码过了一遍后发现多个自定义的配置文件用来装载业务配置代替数据库…

使用 Python 从点云生成 3D 网格

从点云生成 3D 网格的最快方法 已经用 Python 编写了几个实现来从点云中获取网格。它们中的大多数的问题在于它们意味着设置许多难以调整的参数&#xff0c;尤其是在不是 3D 数据处理专家的情况下。在这个简短的指南中&#xff0c;我想展示从点云生成网格的最快和最简单的过程。…

继承和派生

&#x1f436;博主主页&#xff1a;ᰔᩚ. 一怀明月ꦿ ❤️‍&#x1f525;专栏系列&#xff1a;线性代数&#xff0c;C初学者入门训练&#xff0c;题解C&#xff0c;C的使用文章&#xff0c;「初学」C &#x1f525;座右铭&#xff1a;“不要等到什么都没有了&#xff0c;才下…

手撕数据结构—队列

队列队列的话只允许在一端插入&#xff0c;在另外一端删除。插入数据的那一段叫做队尾&#xff0c;出数据的那一段叫做队头&#xff08;从尾巴插入&#xff09;。因此的话队列是先进先出的。入的顺序与出的顺序的话是一样的。这个与栈是不一样的&#xff0c;因为栈的话就是说如…

问题【Java 基础】

基础1、成员变量与局部变量的区别2、静态变量有什么作用3、字符型常量和字符串常量的区别4、静态方法为什么不能调用非静态成员5、静态方法和实例方法有何不同6、重载和重写有什么区别7、什么是可变长参数8、Java 中的几种基本数据类型了解么9、基本类型和包装类型的区别10、包…

【数据结构】树和二叉树的概念及结构

目录 1.树概念及结构 1.1 树的概念 1.2 树的相关概念 1.3树的表示 1.4 树在实际中的应用 2.二叉树概念及结构 2.1 概念 2.2 特殊的二叉树 2.2.1 满二叉树 2.2.2 完全二叉树 1.树概念及结构 1.1 树的概念 树是一种非线性的数据结构&#xff0c;它是由n(n>0) 个有…

一款专门为自动化测试打造的集成开发工具【Aqua】,“能快速构建自动化测试项目”,就问你爽不爽吧,,,

你好&#xff0c;我是不二。 随着行业内卷越来越严重&#xff0c;自动化测试已成为测试工程师的必备技能&#xff0c;谈及自动化测试肯定少不了编程&#xff0c;说到编程肯定离不开集成开发工具&#xff0c;比如&#xff1a;IntelliJ IDEA可以帮助我们快速构建Maven项目、sprin…

前端已死?后端已亡?弯弯绕绕,几分真几分假

前段时间&#xff0c;我在掘金分享了一篇GPT-4 性能文章&#xff0c;也许是过于强大带来的威胁性&#xff0c;引来评论区的排队哀嚎&#xff08;如下图&#xff09;&#xff0c;所以“前端已死&#xff0c;后端已亡”这个概念真的成立吗&#xff1f;本文着重探讨前端。 前端和后…

警惕,3月20日WOS目录更新,50本SCI/SSCI被剔除,这个出版社多达18本

2023年3月SCI、SSCI期刊目录更新 2023年3月20日&#xff0c;Web of Science核心期刊目录再次更新&#xff01;此次2023年3月SCIE & SSCI期刊目录更新&#xff0c;与上次更新&#xff08;2023年2月&#xff09;相比&#xff0c;共有50本期刊被剔除出SCIE & SSCI期刊目录…

[ 网络 ] 应用层协议 —— HTTP协议

目录 1.HTTP协议 1.1URL urlencode和urldecode 2. HTTP协议格式 HTTP请求 HTTP响应 3.告知服务器意图的HTTP方法 GET&#xff1a;获取资源 POST&#xff1a;传输实体主体 GET和POST的区别 使用Cookie的状态管理 4.返回结果的HTTP状态码 状态码告知从服务器端返回的…

三月份跳槽了,历经字节测开岗4轮面试,不出意外,被刷了...

大多数情况下&#xff0c;测试员的个人技能成长速度&#xff0c;远远大于公司规模或业务的成长速度。所以&#xff0c;跳槽成为了这个行业里最常见的一个词汇。 前几天&#xff0c;我看到有朋友留言说&#xff0c;他在面试字节的测试开发工程师的时候&#xff0c;灵魂拷问三小…

【Shell】脚本

Shell脚本脚本格式第一个Shell脚本&#xff1a;hello.sh脚本常用执行方式1. bash或sh脚本的相对路径或绝对路径2. 输入脚本的绝对路径或相对路径3. 在脚本的路径前加上.或者source脚本格式 脚本以#!/bin/bash开头&#xff08;指定解析器&#xff09; #! 是一个约定的标记&…

让 new bing 使用 GPT-4 编写一个令人满意的程序全过程赏析

让 new bing 使用 GPT-4 编写一个令人满意的程序全过程赏析 标签&#xff1a;new bing、GPT-4 文章目录让 new bing 使用 GPT-4 编写一个令人满意的程序全过程赏析前言1 让 bing 编写一个画螺旋线的程序1.1 我的要求&#xff08;1&#xff09;1.2 bing 的回答全文&#xff08;…

p81 红蓝对抗-AWD 监控不死马垃圾包资源库

数据来源 注意&#xff1a;一下写的东西是在p80 红蓝对抗-AWD 模式&准备&攻防&监控&批量这篇文章的基础上进行的 演示案例&#xff1a; 防守-流量监控-实时获取访问数据包流量 攻击-权限维持-不死脚本后门生成及查杀 其他-恶意操作-搅屎棍发包回首掏共权限…

WPF 认识WPF

什么是WPF?WPF是Windows Presentation Foundation(Windows展示基础)简称&#xff0c;顾名思义是专门编写表示层的技术。WPF绚丽界面如下&#xff1a;GUI发展及WPF历史&#xff1f;Windows系统平台上从事图形用户界面GUI(Graphic User Interface)已经经历了多次换代&#xff0c…

web前端开发和后端开发哪个难度大?

前言 因为涉及到的具体的应用的领域不同&#xff0c;所以说不能简单地说哪一个难&#xff0c;对于前端而言你会感觉到入门会非常的简单&#xff0c;这也是会给许多人一种错觉&#xff0c;前端很简单&#xff0c;但是只能说是在入门理解上是有利于新手的&#xff0c;前端在主要…

二叉树系统刷题1

文章目录**BM26** **求二叉树的层序遍历****BM27** **按之字形顺序打印二叉树****BM28** **二叉树的最大深度****BM29** **二叉树中和为某一值的路径(一)****BM30** **二叉搜索树与双向链表****BM31** **对称的二叉树****BM32** **合并二叉树****BM34** **判断是不是二叉搜索树…
最新文章