css,世界上没有绝对简单的事情
引文
自从学了前端的基础,自认为是没什么css是能难倒我的,可是事实是,世界上没有绝对简单的事情,实际上还有好多的东西等待我们去发掘。
详解
1、有些浏览器不完全支持css3,现在可以用 modernizr 工具去检测浏览器是否支持,以及支持哪些项。
2、除了内联元素和块级元素,还有几个标签的默认display并不是block/inline,下面举几个栗子:
table { display:table }
input { display:inline-block }
textarea { display: }
3、textarea无法实现自动扩高的解决办法,利用块级元素标签来实现。
<div contenteditable="true" style="height:200px; min-height:200px; outline:none;"></div>
contenteditable="true" 可编辑的
height 固定高度
outline:none 在火狐点击编辑时会出现虚框,会让人发现这是个冒牌货,去掉虚框
4、 引入css样式表避免用@import,在一个样式文件中使用@import会为页面总体加载时间增加更多一个返程(也就是增加页面的总体加载时间)
在IE中使用@import 将会引起文件的下载顺序被改变。这更会引起样式文件花费更长的时间来下载,这会阻碍页面的渲染,让人感到页面比较慢。
5、让谷歌支持字体10px,单默认最小是12px,-webkit-transform:scale(0.8)。
6、下载图片,<a href="a.jpg" download="自定义图片名称">点击下载</a>。
7、改变form表单placeholder字体颜色,input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{ color:#666; }
8、文本框只读不可编辑 readonly disabled

9、-webkit-appearance: none; 去除input默认样式,可自定义样式
css,世界上没有绝对简单的事情的更多相关文章
- 专注做好一件事(转) focus---这个世界上最成功的人,他们在某一领域获得成功之后,可通过经营杠杆进入任何他们想要涉足的领域。而这都得依赖于他们曾极致的专注在做好一件事情上。
- 改变CSS世界纵横规则的writing-mode属性
改变CSS世界纵横规则的writing-mode属性 这篇文章发布于 2016年04月27日,星期三,23:12,归类于 css相关. 阅读 8292 次, 今日 71 次 by zhangxinxu ...
- 为什么我会认为SAP是世界上最好用最牛逼的ERP系统,没有之一?
为什么我认为SAP是世界上最好用最牛逼的ERP系统,没有之一?玩过QAD.Tiptop.用友等产品,深深觉得SAP是贵的有道理! 一套好的ERP系统,不仅能够最大程度承接适配企业的管理和业务流程,在技 ...
- 《CSS世界》读书笔记(十五)
<!-- <CSS世界>张鑫旭著 --> 字母x——CSS世界中隐匿的举足轻重的角色 在各种内联相关模型中,凡是涉及垂直方向的排版或者对齐的,都离不开最基本的基线(baseli ...
- 《CSS世界》读书笔记(九)
<!-- <CSS世界>张鑫旭著 --> content内容生成技术 1. content 辅助元素生成 清除浮动: .clear:after { content: ''; d ...
- 《CSS世界》读书笔记(七)
<!-- <CSS世界> 张鑫旭著 --> 替换元素 根据是否具有可替换内容,我们可以把元素分为替换元素和非替换元素. <img>.<object>.& ...
- 《CSS世界》读书笔记(五) --height:100%
<!-- <CSS世界> 张鑫旭著 --> 相对简单而单纯的height:auto height:auto比width:auto简单的多,原因在于: CSS默认流是水平方向的, ...
- 《CSS世界》读书笔记(三) --width:auto
<!-- <CSS世界> 张鑫旭著 --> width:auto width:auto至少包含了以下4种不同的宽度表现: 充分可利用空间.比方说,<div>.&l ...
- 软件公司的两种管理方式 总体来说,这个世界上存在两种不同的软件公司的组织结构。我把他们叫做 Widget Factory(小商品工厂) 和 Film Crews(电影工作组
软件公司的两种管理方式 一个简单的回答应该是——“因为在我们的社会里,我们总是会认为薪水和会和职位的层次绑在一起”.但是,这个答案同时也折射出一个事实——我们的薪资是基于我们的所理解的价值,但这并没有 ...
随机推荐
- OS X快捷键小技巧
退出command+Q,关分页Command+W,刷新Command+R,新开分页Command+T 全屏 ctrl+command+F 每个Mac使用者都知道点击下窗口左上角黄色圆形的按钮就可以最小 ...
- CPP-基础:C++的new int()与new int[]
编写一个List类: class List { int length; //列表长度 int* lpInt; //列表指针 List(int size); ~List(); } List::List( ...
- angstromctf -No libc for You
0x00 syscall syscall函数原型为: int syscall(int number, ...) 其中number是系统调用号,number后面应顺序接上该系统调用的所有参数.大概意思是 ...
- Bootstrap 网格系统(Grid System)实例3
Bootstrap 网格系统(Grid System)实例:堆叠水平 <!DOCTYPE html><html><head><meta http-equiv= ...
- Xcode中的约束用法
这篇文章用几个简单的例子来介绍XCode6.1故事板中约束的使用方法. 现在iOS设备屏幕的尺寸也有很多种了,尤其是有了iPhone6 Plus以后,再不关注界面的尺寸适配就有点说不过去了. ...
- BZOJ4513 SDOI2016 储能表 记忆化搜索(动态规划)
题意: 题面中文,不予翻译:SDOI2016储能表 分析: 据说有大爷用一些奇怪的方法切掉了这道题%%%%% 这里用的是大众方法——动态规划. 其实这是一道类似于二进制数位dp的动态规划题,(但是实际 ...
- [SDOi2012]Longge的问题 (数论)
Luogu2303 [SDOi2012]Longge的问题 题目 题目背景 SDOi2012 题目描述 Longge的数学成绩非常好,并且他非常乐于挑战高难度的数学问题.现在问题来了:给定一个整数N, ...
- RuntimeError: Failed to init API, possibly an invalid tessdata path: E:\python36\报错
OCR:光学识别符,tesserocr是python中一个OCR识别库,是对tesseract做的一个python的 API封装,所以它的核心是tesseract 在这里我安装的版本是:tessera ...
- 八:SQL之DQL数据查询语言单表操作
前言: DQL数据库查询语言是我们在开发中最常使用的SQL,这一章总结了单表操作部分的常用查询方式 主要操作有:查询所有字段.查询指定字段.查询指定记录.带IN的关键字查询,范围查询,陪查询.查询空值 ...
- docker:安装mysql
文章来源:https://www.cnblogs.com/hello-tl/p/9234429.html 1.添加镜像 docker pull mysql 2.在/data下新建文件夹mysql,进入 ...