<!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,写一个图标堆叠效果

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

  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. hibernate基本类型映射

    model包: Book.java: package model; import java.sql.Blob;import java.util.Date; public class Book {   ...

  2. iOS -数据库网络之xml解析之远程解析XML

    1.IOS中XML文件获取    //设置远程访问地址     NSURL *url=[NSURL URLWithString:@""];       //创建动态URL请求,并初 ...

  3. three Sum

    Given an array S of n integers, are there elements a, b, c in S such that a + b + c = 0? Find all un ...

  4. sqoop sample code

    本文使用的数据库是mysql的sample database employees. download url:https://launchpad.net/test-db/employees-db-1/ ...

  5. Hive Word count

    --https://github.com/slimandslam/pig-hive-wordcount/blob/master/wordcount.hql DROP TABLE myinput; DR ...

  6. 教你一招 - 如何给nopcommerce做一套自己的主题

    nopcommerce拥有一套不错的模板机制,可以让你快速的做一套属于自己的主题.\Presentation\Nop.Web下面有个Themes文件夹,这里面就是放主题的地方,每个主题对应一个文件夹, ...

  7. python中range函数和xrange函数有什么异同？

    http://ciniao.me/article.php?id=17 简单来说,range生成的是一个列表,而xrange生成的是一个生成器,而生成器在数组很大的时候能够比range更节省空间

  8. 抓取天猫和淘宝的详情页图片|Golang

    taobao.go package main import ( "crypto/md5" "encoding/hex" "fmt" &quo ...

  9. HDU 2082 找单词 --生成函数

    跟上题是一个思路:http://www.cnblogs.com/whatbeg/p/3728545.html 只不过是上一题的扩展. 代码: #include <iostream> #in ...

  10. HDU 2899 Strange fuction 【三分】

    三分可以用来求单峰函数的极值. 首先对一个函数要使用三分时,必须确保该函数在范围内是单峰的. 又因为凸函数必定是单峰的. 证明一个函数是凸函数的方法: 所以就变成证明该函数的一阶导数是否单调递增,或者 ...