如图：

代码：(div和input之间要连续写在一起，不能换行)

<div style="font-size:36px;margin-top:30px">

<div style="display:inline;background-color:#f9f9f9;padding-left:5px;padding-right:5px;border:1px solid #aaa">-</div>
<input type="number" value="1" readonly style="text-align:center;font-size:25px;height:45px;margin-top:-6px;width:100px;border-left:0px;border-right:0px;border-bottom:1px solid #aaa"/>
<div style="display:inline;background-color:#f9f9f9;border:1px solid #aaa">+</div>

</div>

CSS------制作一个带+-的input框的更多相关文章

  1. 用css制作一个三角形箭头

    剑走偏锋——用css制作一个三角形箭头   通常,我们做上图那个三角形,一般都是做张图,而且需要两张,因为一般都是下拉菜单的效果,需要有个hover的样式,箭头是反的.那是不是有更好的办法呢,毕竟要用 ...

  2. html制作一个美观的搜索框

    一般情况下搜索栏就是form标签中的一个input标签. 如: <form> <input type="text" placeholder=" 搜索关键 ...

  3. 用CSS画一个带阴影的三角形的示例代码

    1. 思路 怎么用CSS3画一个带阴影的三角形呢 ? 有童鞋说, 这还不简单吗 网上有很多解决方案, 但其实大多都是实现不太完美的, 存在一些问题 假设我们做一个向下的三角形箭头 常见的方法大致有两种 ...

  4. No.7 - 使用 animate.css 实现一个优雅的登录框

    <!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content ...

  5. css制作三角形，下拉框三角形

    网站制作中常常需要下拉框,而如果下拉框如果只是单纯的矩形则会显得太过单调,所以这次教大家利用css制作三角形放在矩形上面 首先利用css制作三角形 div { width:0px; height:0p ...

  6. D3.js(v3)+react 制作 一个带坐标与比例尺的柱形图 (V3版本)

    现在用D3.js + react做一个带坐标轴和比例尺的柱形图.我已经尽力把代码全部注释上了,最后我也会把完整柱形图代码奉上.如果还有疑惑的,可以去翻看一下我之前介绍的方法,以下方法都有介绍到. 还有 ...

  7. CSS制作一个简单网页的下拉导航栏

    网页下拉导航栏的制作 网页下拉导航栏的制作很简单,只需要运用好CSS中伪选择器. 首先说明几个简单的伪选择器(比较常用的): link:连接平常的状态 visited:连接被访问过之后 hover:鼠 ...

  8. 百度前端笔试题目--css 实现一个带尖角的正方形

    今天在牛客网上看到这道题,发现自己并不会,看来自己css都没怎么学习,也不怎么会用.看了下答案,不是很明白,也在网上搜集了一些资料和解法,感觉一些同学博客上也写了一些解法和拓展,所以就在这里借鉴一下咯 ...

  9. [前端随笔][CSS] 制作一个加载动画 即帖即用

    说在前面 描述 [加载中loading...] 的动画图片往往使用GIF来实现,但GIF消耗资源较大,所以使用CSS直接制作更优. 效果传送门1 效果传送门2 关键代码 @keyframes 规则 用 ...

随机推荐

  1. 团队Git使用教程

    团队git使用教程(不要使用IDE自带版本控制功能) 角色分配:项目观察者.项目拥有者.项目开发人员 场景:项目拥有者创建项目 1. 在当前目录新建一个git代码库 git init "te ...

  2. Atcoder Grand 012 C - Tautonym Puzzle

    题意: 构造一个字符串,使得这个字符串有只有n个形如AA这样的子序列. 神TM构造题不会做,, 我们构造一个长度为2*m的字符串,前m个是一个1-m的排列,后m个就是按顺序1-m. 这样这个串里符合要 ...

  3. （转）java中使用memcache

    背景:公司项目中使用java和memcache相结合来搭建缓存,所以要了解下缓存的基础知识! 1 了解memcache 1.1 基础知识 什么是Memcache? Memcache集群环境下缓存解决方 ...

  4. 初识python面向对象编程

    初识python面向对象编程 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.面向过程的程序设计思想 #!/usr/bin/env python #_*_coding:utf-8 ...

  5. 什么是HTTP协议

    什么是Http协议Http协议即超文本传送协议 (HTTP-Hypertext transfer protocol) .它定义了浏览器(即万维网客户进程)怎样向万维网服务器请求万维网文档,以及服务器怎 ...

  6. bzoj千题计划247：bzoj4903: [Ctsc2017]吉夫特

    http://uoj.ac/problem/300 预备知识: C(n,m)是奇数的充要条件是 n&m==m 由卢卡斯定理可以推出 选出的任意相邻两个数a,b 的组合数计算C(a,b)必须是奇 ...

  7. Windows bat 学习（高级）

    有一种叫做 Command Processor Extensions 的东西,即命令处理器扩展.他会使命令更加高级,功能更多. 在 cmd 里可以使用 ECHO %CMDEXTVERSION% 查看当 ...

  8. HDU 2066 一个人的旅行 最短路问题

    题目描述:输入的第一行有三个数,T,S,D,T表示一共有多少条线路,S表示起点的个数,D表示终点的个数,接下来就是输入T条路的信息了,要你判断从多个起点中任意一个到多个终点中的任意的一个的最短距离是多 ...

  9. C# 解决VS2008在win7找不到输入序列号的地方

    1.VS2008在Windows7 打开维护界面看不到可以输序列号的地方. 因为微软把他隐藏了. 2.我们可以借用工具把他显示出来 下载地址:http://www.zlsoft.com/techbbs ...

  10. Linux下USB suspend/resume源码分析【转】

    转自:http://blog.csdn.net/aaronychen/article/details/3928479 Linux下USB suspend/resume源码分析 Author:aaron ...