己所不欲,勿施于人 [登录·注册]

吕滔博客

首页 开发 运维 工具 摄影
  • 01124

    CSS样式之overflow属性

    memoryoverflow 属性规定当内容溢出元素框时发生的事情。所有主流浏览器都支持 overflow 属性。当然任何的版本的 Internet Explorer (包括 IE8)都不支持属性值 "inherit"。先上代码div { overflow:scroll; }可以设置的值值描述visible默认值。内容不会被修剪,会呈现在元素框之外。hidden内容会被修剪,并且其余内容是不可见的。scroll内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容。auto如果内容被修剪,则浏览器...

    前端设计 CSS 发布于 2018-01-15
  • 04407

    div+css按比例布局:宽度为百分比高度自动等比正方形的实现方式

    memory第一种方案效果css文件body { width: 100%; font-size: 0; text-align: center; } div { display: inline-block; width: 20%; background: green; font-size: 12px; position: relative; vertical-align: middle; } div:nth-child(2n) { background: oran...

    前端设计 CSS 发布于 2017-05-15
  • 05606

    纯 CSS 创建各种不同的图形形状

    memory矩形.rectangle { width: 250px; height: 150px; background-color: #6DC75F; } <div class="rectangle"></div>三角形.triangleUp { border-left: 75px solid transparent; border-right: 75px solid transpa...

    前端设计 CSS 发布于 2015-11-16
  • 05574

    新手入门响应式布局--响应式布局的那些事儿

    memory讲到响应式布局,相信大家都有一定的了解,响应式布局是今年很流行的一个设计理念,随着移动互联网的盛行,为解决如今各式各样的浏览器分辨率以及不同移动设备的显示效 果,设计师提出了响应式布局的设计方案。今天就和大家来讲讲响应式布局这件小事,包含什么是响应式布局、响应式布局的优点和缺点以及响应式布局该怎么设计(通过CSS3 Media Query实现响应布局)。一、什么是响应式布局? 响应式布局是Ethan Marcotte在2010年5月份提出的一个概念,简而言之,就是一个网站能够兼容多个终端...

    前端设计 CSS 发布于 2013-05-29
  • 07800

    根据链接的内容不同,定制不同的CSS样式 CSS之特殊用法

    memoryCSS还可以这样用、你知道吗?利用CSS给链接添加一个ICO图标a[href$='.zip'], a[href$='.rar'], a[href$='.gzip']{background:transparenturl(images/zip.png)center right no-repeat;display:inline-block;padding-right:35px;}a[href$='.pdf']{background:transparenturl(images/...

    前端设计 CSS 发布于 2013-05-18
  • 07403

    又地震了.一个前端代码。通过CSS让整个网页变黑白

    memoryhtml{ filter: grayscale(100%); -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: url("data:image/svg+xml;utf8,<svg xmlns="\'http://www.w3.org/2000/svg\'"&...

    前端设计 CSS 发布于 2013-04-21
  • 07072

    textarea标签中resize缩放属性的设置

    memoryCSS3中新增了resize缩放属性,这个属性可以应用到任意元素。目前只有Webkit内核的浏览器才支持这个css3属性,即Google chrome和Apple safari都支持。而textarea标签中,Webkit内核的浏览器会默认resize的值为both,即用户可以调节元素的宽度和高度。如下图就是在Google chrome中我博客的textarea的默认显示,textarea右下角有一个可以控制缩放的按钮。一般情况下,textarea是被固定宽度...

    前端设计 CSS 发布于 2013-04-12
  • 09036

    CSS兼容性技巧整理--从IE6-IE9 火狐谷歌浏览器兼容

    memory CSS兼容性技巧整理--从IE6-IE9 火狐谷歌浏览器兼容本文收集整理了IE7,6与Fireofx的CSS兼容性处理技巧,供大家参考。CSS兼容常用技巧请尽量用xhtml格式写代码,而且DOCTYPE影响 CSS 处理,作为W3C标准,一定要加DOCTYPE声明。1.div的垂直居中问题vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就...

    前端设计 CSS 发布于 2013-04-12
  • 网站状态

    • 栏目分类:49个
    • 发布文章:1553篇
    • 用户评论:834条
    • 开博至今:4337天

    正则速查

    [abc] 匹配中括号中的单个字符,如a或b或c
    [^abc] 匹配除了a、b、c等字符的其他单个字符
    [a-z] 匹配一个字符范围,如a到z
    [a-zA-Z] 匹配一个字符范围,如a-z 或 A-Z
    ^ 匹配行的开始
    $ 匹配行的结束
    \A 匹配一个字符串的开始
    \z 匹配一个字符串的结束
    . 匹配任意单个字符
    \s 匹配空白字符,如空格,TAB
    \S 匹配非空白字符
    \d 匹配一个数字
    \D 匹配非数字
    \w 匹配一个字母
    \W 匹配非字母
    \b 匹配字符边界
    (...) 引用所有括号中的内容
    (a|b) a或者b
    a? 零个或1个a
    a* 零个或多个a
    a+ 1个或多个a
    a{3} 3次重复的a
    a{3,} 3次或3次以上重复的a
    a{3,6} 3到6次重复的a

    修正符

    /g 查找所有可能的匹配
    /i 不区分大小写
    /m 多行匹配
    /s 单行匹配
    /x 忽略空白模式
    /e 可执行模式,PHP专有
    /A 强制从目标字符串开头匹配
    /D 使用$限制结尾字符,则不允许结尾有换行
    /U 只匹配最近的一个字符串;不重复匹配

    最新回复

    • 小云: 不错
    • tper: 你列子中按分类归档的图片,每个分类下面显示分类下的文章的代码是怎...
    • 小云: 写的很不错
    • 女装品牌: 文章不错支持一下
    • memory: 升级之后不能访问是密码套件的事儿。其实可以配置好一个写公共文件引...
    • 欧文斯: 很奇怪,都升级之后 443 SSL 加密不能访问,其他端口却可以
    • 子午书屋: 好久没使用memcache了
    • 小云: 写的不错,谢谢分享
    • yiye: 楼主你好,不知道我回复的邮件您看到没?我下载的JPress不是最...
    • memory: 海哥最近更新的新版的我还没有测试过。具体原因还不清楚。不过你可能...
    • yiye: 楼主,我下的是最新的官方mysql镜像,然后密码用户名都正确,数...
    • memory: 这个是15年的文章了,这几年不知道有没有变化 。 你可以根据错误...
    • nice: 请教下这个评论审核提示代码是直接在评论模板调用的吗,我直接用了...
    • vultr: 学习了
    • 小云: 厉害,实用
    • memory: NND。自己写的看不懂了。。。
    • memory: 服务器上的一个配置.