HTML&&CSS
文章平均质量分 58
lijunlinlijunlin
这个作者很懒,什么都没留下…
展开
-
如何去掉a标签的下划线
首先来了解下标签的一些样式:标签的伪类样式一组专门的预定义的类称为伪类,主要用来处理超链接的状态。超链接文字的状态可以通过伪类选择符+样式规则来控制。伪类选择符包括: 总: a 表示所有状态下的连接 如 a{color:red} ① a:link:未访问链接 ,如 a:link {color:blue} ② a:visited:已访问链接 ,如 a:v转载 2013-04-04 01:30:07 · 1003 阅读 · 0 评论 -
textarea如何实现高度自适应
转载自:http://www.xuanfengge.com/textarea-on-how-to-achieve-a-high-degree-of-adaptive.html今天需要些一个回复评论的页面,设计师给的初始界面就是一个只有一行的框。然后当时就想这个交互该怎么实现比较好,然后想起了新浪微博的做法:点击评论,默认显示一行,当输入的文字超过一行或者输入Enter时,输入框的高度会随着转载 2016-04-08 00:59:40 · 519 阅读 · 0 评论 -
jquery实现textarea 高度自适应
转载自:http://www.jb51.net/article/61997.htm用jquery实现的textarea 高度自适应代码。这个动画效果比较流畅。适合新手学习。非常简单实用,这里推荐给小伙伴们。之前给大家分享过用Javascript控制文本框textarea高度随内容自适应增长收缩,今天花了点时间换了种实现方法,总结一下复制代码 代码如下:jQuery.fn转载 2016-04-08 01:04:12 · 2572 阅读 · 0 评论 -
textarea文本域自适应高度
转载自:http://www.wangshizhao.cn/textareaef6ncg0x.html在作为留言或者其他的网站备注的地方都是用的textarea,但是当文字多过其高度的时候,前面的文字就被顶到上面去了,要看内容还要翻上去。当有了这个就不需要了,因为他会自动增加高度,适应当前的文字高度。方法其实很简单,建议以后模板的作者可以加上。1.引入Jquery.转载 2016-04-08 01:05:47 · 3858 阅读 · 0 评论 -
Textarea根据内容自适应高度
转载自:http://www.jb51.net/article/42468.htm使用JAVASCRIPT控制Textarea内容自适应高度,实施起来很简单,很平滑。直接看代码吧,很简单,也很实用。复制代码 代码如下:autoresizing textareatextarea { border: 0 none white; ove转载 2016-04-08 01:11:31 · 976 阅读 · 0 评论 -
IE8下textarea的onpropertychange问题Stack overflow at line.
代码如下: Document body { background:#fff; } textarea {width:300px; min-height:60px; overflow:hidden; resize:none;} $(function(){原创 2016-04-13 02:54:33 · 1405 阅读 · 0 评论 -
js监听textarea文本域变化使高度自适应
转载自:http://my.oschina.net/tearlight/blog/191927在网友Amin的帮助下,找到了一个兼容浏览器的方法(详情 http://dramin.duapp.com/?p=112)主要是通过判断输入状态的改变,类似于onchange,IE9以上 、firefox、chrome等都支持了Html中的oninput事件,而IE6/7/8则可以通过onpro转载 2016-04-13 02:48:20 · 5222 阅读 · 0 评论 -
div变为输入框
Document 标题dsdfd> -------------------------------------------------------------------divedit.css* { background-rep原创 2016-04-26 02:51:17 · 2888 阅读 · 0 评论 -
ul li宽度超出div宽度点击左右箭头移动
转载自:http://blog.csdn.net/chenhisen/article/details/50337377 无标题文档 ul{margin:0;padding:0;} li{list-style:none;} .box{width: 500px; margin: au转载 2016-04-14 02:22:35 · 6574 阅读 · 0 评论 -
div模拟textarea文本域轻松实现高度自适应
转载自:http://www.zhangxinxu.com/wordpress/2010/12/div-textarea-height-auto/一、关于textarea文本域以及高度自适应textarea标签为表单元素,一般用在多行文字的输入。在web应用上常见的是评论输入框,微博信息输入框等。例如企鹅微博的输入框:作为多行文本域功能来讲,textarea满足了我们大部分的需转载 2016-04-08 01:01:30 · 734 阅读 · 0 评论 -
DIV常见任务(下) —变身为编辑器及div的各种diy应用
转载自:http://www.jb51.net/web/72342.html自从HTML5中新引入了contentEditalbe属性以后,div就与textarea一样,可以作为最常用的编辑器使用。 1.启用div作为编辑器 让div进入编辑状态很简单,只需要: 复制代码代码如下:div.contentEditable=true; 这样就可以进转载 2016-04-11 00:39:33 · 750 阅读 · 0 评论 -
DIV常见任务(上) —常规任务(显示滚动条/隐藏div/禁止事件冒泡等等)
转载自:http://www.jb51.net/web/72339.html作为最常用的布局元素,DIV在Web开发中起着至关重要的作用。这里总结一下我在使用DIV中遇到的各种操作。 1.div显示滚动条 这个是很常见的一个任务了,基本是通过CSS去实现滚动条。 (1)垂直滚动条 设置是否显示滚动条主要是在CSS中设置下列的属性: 复制代码代码如下:转载 2016-04-11 00:42:52 · 1053 阅读 · 0 评论 -
使用css禁止textarea调整大小功能的方法
转载自:http://www.ynpxrz.com/n1033936c2022.aspx如果你使用谷歌浏览器或火狐浏览器,你会发现页面上的textarea元素的右下角有个小三角,用鼠标箭头拖拽它,你的textarea就能随着放大或缩小。这是现代浏览器为方便用户而添加的一个辅助功能(很遗憾,不包括ie,如果你使用ie,是看不到的。)。web程序员在设计网页时,一般给了textarea一个固定转载 2016-04-11 01:09:19 · 825 阅读 · 0 评论 -
十步图解CSS的position
转载自:http://blog.jobbole.com/49320/CSS的positon,我想做为一个Web制作者来说都有碰到过,但至于对其是否真正的了解呢?那我就不也说了,至少我自己并不非常的了解其内核的运行。今天在Learn CSS Positioning in Ten Steps一文中分十步介绍了CSS的“position”中的“static、relative、absolute、f转载 2016-01-02 00:17:04 · 292 阅读 · 0 评论 -
CSS3阴影 box-shadow的使用和技巧总结
text-shadow是给文本添加阴影效果,box-shadow是给元素块添加周边阴影效果。随着html5和CSS3的普及,这一特殊效果使用越来越普遍。基本语法是{box-shadow:[inset] x-offset y-offset blur-radius spread-radiuscolor}对象选择器 {box-shadow:[投影方式] X轴偏移量 Y轴偏移量阴影模糊半径转载 2015-10-25 13:34:11 · 432 阅读 · 0 评论 -
前端不为人知的一面–前端冷知识集锦
前端已经被玩儿坏了!像console.log()可以向控制台输出图片等炫酷的玩意已经不是什么新闻了,像用||操作符给变量赋默认值也是人尽皆知的旧闻了,今天看到Quora上一个帖子,瞬间又GET了好多前端技能,一些属于技巧,一些则是闻所未闻的冷知识,一时间还消化不过来。现分类整理出来分享给大家,也补充了一些平时的积累和扩展了一些内容。HTML篇浏览器地址栏运行JavaScript代码这个转载 2015-09-26 19:26:34 · 436 阅读 · 0 评论 -
Web开发者不容错过的20段CSS代码
Web开发技术每年都在革新,浏览器已逐渐支持CSS3特性,并且网站设计师和前端开发者普遍采用这种新技术进行设计与开发。但仍然有一些开发者迷恋着一些CSS2代码。本文将分享20段非常专业的CSS2/CSS3代码供大家使用,你可以把它们保存在IDE里、或者存储在CSS文档里,这些代码片段绝对会给你带来意外的惊喜。1. CSS Resets网络上关于CSS重置的代码非常多。本段代码是根据Er转载 2013-05-25 14:00:11 · 560 阅读 · 0 评论 -
网页文字中间加横线
网页文字中间加横线打杠比较简单, 有个非标的html标签可以用: 已经过期 显示就是: 已经过期转载 2013-06-03 00:38:51 · 4316 阅读 · 0 评论 -
25 Effective Website Navigation Designs
A Well Designed Navigation is vital for any website. Being a Designer, Layout Structure based on Navigation. In case of without navigation, a site loses all sense of organisation and structure.Effec转载 2013-06-05 02:01:21 · 779 阅读 · 0 评论 -
CSS文本溢出省略号:text-overflow:ellipsis及firefox兼容详解
很多时候,比如网站最基本的文章列表,标题会很长,而显示列表的区域宽度却没有这么宽,这时候最正常的做法就是让超出宽度的部分文字用省略号(…)来表示。通常做法是网站后台程序截取。 这个标题其实已经是一个老生常谈的问题了。很多时候,比如网站最基本的文章列表,标题会很长,而显示列表的区域宽度却没有这么宽,这时候最正常的做法就是让超出宽度的部分文字用省略号(…)来表示。通常做法是网站后台程序截取转载 2015-03-28 02:17:23 · 1804 阅读 · 0 评论 -
CSS省略号text-overflow超出溢出显示省略号
DIV CSS text-overflow文本有溢出时显示css省略号clip ellipsis样式基础知识与用法实例经验教程篇有时为了避免文本文字内容超出一定宽度后溢出,我们想要溢出的部分不显示但用省略号(...)显示,这个时候我们可以使用CSS text-overflow文本溢出省略号属性样式实现。一、text-overflow省略号样式语法结构 - TOPtext-o转载 2015-03-28 02:20:26 · 728 阅读 · 0 评论 -
Pure : 来自雅虎的纯 CSS 框架
Pure也是一款很出色的CSS框架,之前分享的Bootstrap是由Twitter出品的,而Pure是来自雅虎的。尽管从UI界面效果上来说,Pure没有Bootstrap那样精美,但Pure是纯CSS实现的,因此非常小巧,整个框架压缩后只有5.7k左右。Pure的特点最大的特点就是框架基于纯CSS,无任何JavaScript代码,渲染速度比较快。由Yahoo出品,技术上应该不存在太大问转载 2015-04-02 01:23:30 · 770 阅读 · 0 评论 -
为何img、input等内联元素可以设置宽、高
元素是文档结构的基础,在CSS中,每个元素生成了一个包含了元素内容的框(box,也译为“盒子”)。但是不同的元素显示的方式会有所不同,例如和就不同,而和也不一样。在文档类型定义(DTD)中对不同的元素规定了不同的类型,这也是DTD对文档之所以重要的原因之一。1. 替换和不可替换元素从元素本身的特点来讲,可以分为替换和不可替换元素。a) 替换元素替换元素就是浏览器根据元素的标签和转载 2015-05-24 12:38:22 · 449 阅读 · 0 评论 -
css word-wrap和word-break强制换行
本文摘自:http://www.wufangbo.com/css-qiang-zhi-huan-hang/强制换行与强制不换行问题曾经一度困扰着我,每当遇到换行问题时候那就是痛苦回忆的开始,现在终于痛定思痛,一鼓作气把这个长期顽固问题给解决。强制换行与强制不换行用到的属性我们一般控制换行所用到的CSS属性一共有三个:word-wrap;word-break; white-space转载 2015-05-26 02:06:28 · 356 阅读 · 0 评论 -
CSS布局奇淫巧计之-强大的负边距
css中的负边距(negative margin)是布局中的一个常用技巧,只要运用得合理常常会有意想不到的效果。很多特殊的css布局方法都依赖于负边距,所以掌握它的用法对于前端的同学来说,那是必须的。本文非常基础,老鸟可以略过。 负边距在普通文档流中的作用和效果那些没有脱离文档流的元素(指不是浮动元素也不是绝对定位、固定定位的元素等),其在页面中的位置是跟随者文档流的变化而变化的。看下转载 2015-09-05 03:00:35 · 379 阅读 · 0 评论 -
圣杯布局与双飞翼布局的实现思路
原文地址:圣杯布局与双飞翼布局的实现思路作者:ygtzz出处:http://99jty.com/?p=432 圣杯布局与双飞翼布局的实现思路 圣杯布局 HTML代码: main sub转载 2015-09-05 03:01:39 · 517 阅读 · 0 评论 -
双飞翼布局(圣杯布局)介绍-始于淘宝UED
仔细分析各种布局的技术实现,可以发现下面三种技术被经常使用:浮动 float负边距 negative margin相对定位 relative position这是实现布局的三个最基本的原子技术。只要巧妙组合,并加以灵活运用,就能“拼”出各种布局的实现方案。尝试之路考虑以下DOM结构:[html] view plaincopydiv id=转载 2015-09-05 03:06:38 · 445 阅读 · 0 评论 -
圣杯布局与双飞翼布局的实现思路
主要为了理解思考的过程,而不是仅仅为了背过一段代码。1负边距 margin-left为负值,且两个元素不在一行的时候(可以用元素float:left,width:100%实现)margin-left可以吃掉兄弟元素的margin.想像一下,假设width:99%,右边留一条缝隙,当margin-left为负值,即可让右边的这条缝隙向左走即当使用margin左负值,超过自身的宽度时,这转载 2015-09-05 03:03:55 · 500 阅读 · 0 评论 -
IE6-9不支持Textarea的maxlength属性
转载自:http://www.cnblogs.com/snandy/p/4255668.html给textarea标签添加一个maxlength=200,测试工程师提bug说IE9没起作用。后一测试,发现IE10一下的浏览器均不支持1textareamaxlength="200">textarea>去w转载 2016-05-06 01:56:41 · 640 阅读 · 0 评论