css写一个梯形

时间：2022-02-03 00:22:11

css写一个梯形

<!DOCTYPE html><html>

<head>

<meta charset="UTF-8">

<title>Document</title>

<style type="text/css">

.trapezoid{ border-bottom: 100px solid red; border-left: 50px solid transparent; border-right: 50px solid transparent;            width: 100px;        }    </style></head>

<body>    <div class='trapezoid'></div></body></html>

css写一个梯形的更多相关文章

  1. 还在为小三角形切图？使用纯CSS写一个简单的三角形

    同学们,当美工给的设计图是这样: 或者这样: 我的内心其实是拒绝的-_-:但工作还得干,大部分同学会写 <style> .icon{width:20px;height:20px;displ ...

  2. 玩玩CSS&comma;写一个图标堆叠效果

    遇到有人问如下效果怎么写,一时兴起,自己写一个玩玩. 看到这个样子,首先应该考虑一下 DOM 结构,以我的观点,把DOM结构设计为如下形式: <div> <img src=&quot ...

  3. CSS写一个圣诞树Chrome浏览器小插件

    一时兴起,突然想写一个Chrome浏览器插件,不知道写啥,就写了一个圣诞树小插件.项目源码>> Chrome浏览器插件 Chrome浏览器插件最主要的是:index.html.manife ...

  4. 纯css写一个大太阳的天气图标

    效果 效果图如下 ​ 实现思路 div实现太阳的一条矩形光影 before伪元素制作另一条光影矩形,和已有的转变90° after伪元素画个圆实现太阳样式 dom结构 用两个嵌套的div容器,父容器来 ...

  5. 如何用css写一个带斜切角、有边框又有内外阴影的按钮呢？

    如果有一天,UI设计师丢过来一张UI稿,上面有这样一个带有斜切角.有边框还有内外阴影的按钮,你会怎么实现呢?第一反应切图?可是按钮内容.大小都是可变的,那得切多少图啊~Canvas?SVG?No,no ...

  6. Java-Web 用html和css写一个EasyMall注册界面

    要求: html代码: <!DOCTYPE html> <html> <head> <title>EasyMall注册页面</title> ...

  7. css 写一个向右的箭头

    经常写移动端页面时会用到向右的箭头,之前都是用图片,突然想到用css应该也能写,于是一搜还确实有 width: 7px; height: 7px; border-top: 2px solid #fff ...

  8. 用html和css写一个头部header和左侧菜单栏menu-bar固定的的页面

    这个页面header部分是100%的宽度,60px的高度,左侧是刚好一屏的高度,180的宽度,右侧的部分把剩余的空间占满,刚开始的时候还没怎么接触这样的页面,以为使用js读取浏览的可视化宽高,然后在做 ...

  9. 用html，CSS 写一个静态的博客网页

    <!doctype html> <html> <br/><br/><br/> <head> <meta http-equi ...

随机推荐

  1. windows平台解决quick3&period;5final &plus; sublimeText3 模拟器找不到的问题

    下载了quick3.5 准备在sublime上进行开发,结果发现quick3.5中的player模拟器不见了,原来模拟器移到了quick引擎主目录下的 /tools/simulator/runtime ...

  2. 使用 Express 和 waterline 创建简单 Restful API

    这几篇都是我原来首发在 segmentfault 上的地址:https://segmentfault.com/a/1190000004996659  突然想起来我这个博客冷落了好多年了,也该更新一下, ...

  3. Android studio mac版本快捷键

    Mac下快捷键的符号所对应的按键 ⌥—> option|alt ⇧—>shift ⌃—>control ⌘—>command ⎋—>esc 注: 与F6/F7/F12等F ...

  4. linux下 启动node 和关闭node

    1.用forever  进行管理 npm install -g forever forever start app.js //启动 forever stop app.js //关闭 2.用自带的服务n ...

  5. springboot项目如何打包成war包

    一.修改打包形式 在pom.xml里设置 <packaging>war</packaging> 二.移除嵌入式tomcat插件 在pom.xml里找到spring-boot-s ...

  6. ajax 提交数组 泛型集合（嵌套集合）

    直接上代码 后台接口: A类型中嵌套了 List<B> B类型中嵌套了 List<C> [HttpPost] public string Post(A a) { return ...

  7. Http协议的理解

    作者技术有限,这篇博文都是结合网上的文章和自己的理解而写的,若存在错误,请无私指出,十分感谢! 协议,就是一种标准,即大家都要遵守的标准. 举个简单的例子:在中国,几乎人人都会讲普通话,不同地区的人有 ...

  8. Android之zip文件加密解压及进度条的实现

    zip文件的解压能够使用java的zip库,可是没有实现对加密文件的解压功能,这里能够使用zip4j来实现.详细能够參看该文<Android下zip压缩文件加密解密的完美解决方式>.该文件 ...

  9. MySQL线程池总结

    线程池是Mysql5.6的一个核心功能,对于服务器应用而言,无论是web应用服务还是DB服务,高并发请求始终是一个绕不开的话题.当有大量请求并发访问时,一定伴随着资源的不断创建和释放,导致资源利用率低 ...

  10. 20145307第四次JAVA学习实验报告

    20145307实验四 Android开发基础 实验内容 基于Android Studio开发简单的 Android应用并部署测试; 了解Android组件.布局管理器的使用: 掌握Android中事 ...

相关文章