好好做前端

<p></p>1.ridge p{ width: 200px; height: 200px; border-width: 3px; border-style: ridge; border-color: #faf;}2.groove p{ width: 200px; height: 200px; border-wid

将链接存于此，比收藏在文件夹里靠谱， 《 The Shapes of CSS 》，简直厉害了！1、计数器效果<ul> <li>white，我要去帮助姐姐测试，你去吗？</li> <li>测啥呀，好玩不?</li> <li>当然好玩了，就是要给我们说的每一句话进行排序。</li> <li>咦？什么意思，带我去吧！</li> <li>好的，那我们开始咯！</li>

1、禁止IOS，Android长按下载图片.css { -webkit-touch-callout : none; }2、禁止IOS，Android用户选中文字 .css { -webkit-user-select : none; }3、① IOS中input [ type =’button’] 显示的不是自己设置的样式，而是IOS默认样式；② 移动端IOS手机下清除输入框内阴影input [

今天一个朋友说遇到一个面试题，无论是何种元素（inline，inline-block，block）在设置float之后，都可以改变他的宽度和高度了。做前端这么久我竟然都没思考过这个问题，罪过罪过啊。下面一个小小例子，测试一下。效果图：现在这种情况下 ，如果想让他们看起来好看点只能设置padding来扩充，因为span是行内元素，无法设置宽度和高度，全靠里面的内容撑起来。

之前写过一篇博客，介绍如何让chrome的字体小于12px，戳这里查看今天我们来说下在移动端开发时如何让字体小于12px。在改变chrome字体的时候，在各路大神那里看到过这个方法：当样式表里font-size可是无论我怎么尝试都没效果。还望大神们指教，但重点是！！这句话在移动端相当有用呀。而且我用的时候直接把这句话写在了你想改变字体的元素样式里，例如这样

这是大多数浏览器默认的文字选中样式： 如果你是想让它符合整个网站的风格，就可以选择自定义选中的背景颜色和字体颜色。用户选中文字时的自定义颜色：p::selection { background:#ccc; color:#ff645d;}p::-moz-selection { background:#ccc; color:#ff645d;}p::-webkit

真心觉得移动端开发坑好多，不过解决问题也有不少乐趣，也能总结很多经验方法，都是之前遇到的，想记录下来方便翻阅。在iOS测试的时候，每次input获取焦点都会使页面放大，真是要多丑有多丑，经多方求助终于得到这个美丽的方法解决一下，之前总是在head中写超多的meta标签，但有一些都没去追寻他们是啥意思。这个问题就是吃了这个亏。<meta name="apple-mobile-web-app-capab

兼容性先放在这里：引自 Using Flexbox: Mixing Old and New for the Best Browser Support 、最佳浏览器兼容父元素{ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */ display: -moz-box; /* OLD - Firefox 19- (buggy bu

混合App，前端H5页面，实现导航栏滑动到的时候贴顶。注意：首先写的时候，监听scroll事件，滑动到指定位置时改为定位 position:fixed;，实际运用过程中，IOS无法实时监听scroll事件，在滚动停止之后才触发的 $(window).on(&quot;scroll&quot;, function () { var _this = $(this), s...