HTML/CSS - 随笔分类 - 自转不息

CSS3：pointer-events | a标签禁用

摘要：用纯css就能实现取消事件响应的方法，pointer-events，使用起来更加简单，它可以： 1 阻止用户的点击动作产生任何效果 2 阻止缺省鼠标指针的显示 3 阻止CSS里的hover和active状态的变化触发事件 4 阻止JavaScript点击动作触发的事件比如以下CSS就顺起到将禁用的阅读全文

posted @ 2018-03-05 19:32 自转不息阅读(364) 评论(0) 推荐(0)

CSS3: @font-face 介绍与使用

摘要：@font-face 是CSS3中的一个模块，他主要是把自己定义的Web字体嵌入到你的网页中，随着@font-face模块的出现，我们在Web的开发中使用字体不怕只能使用Web安全字体，你们当中或许有许多人会不自然的问，这样的东西IE能支持吗？(@font-face这个功能早在IE4就支持了你肯定会阅读全文

posted @ 2018-03-05 10:55 自转不息阅读(603) 评论(0) 推荐(0)

css公共样式 | 标签元素初始化

摘要：PC参考样式1： PC参考样式2：移动端参考样式： /************************************************************************************************************************** 阅读全文

posted @ 2018-03-04 18:13 自转不息阅读(427) 评论(0) 推荐(0)

if IE语句 | 判断浏览器IE版本及添加升级提示

摘要：本文引自：http://blog.csdn.net/u013372487/article/details/48521929 实现方法判断当前浏览器是否IE6（或IE6内核）  判断当前阅读全文

posted @ 2018-03-04 15:16 自转不息阅读(479) 评论(0) 推荐(0)

低版本IE兼容 H5+CSS3 方案

摘要：【主要是针对ie6 7 8对支持和让老浏览器支持html5+css3的一些js脚本】 html5shiv.js // 让IE8及耕地版本的IE识别section,article,nav等html5元素 cdn地址：注意：都要初始化新标签的CSS.因为HTML5在默认情况下表现为内联元素，对这些元素阅读全文

posted @ 2018-03-04 15:07 自转不息阅读(1782) 评论(0) 推荐(0)

Meta 用法汇总

摘要：本文引自： http://blog.csdn.net/MR_LP/article/details/53607087 什么是 meta ？ meta 是html语言head区的一个辅助性标签。也许你认为这些代码可有可无。其实如果你能够用好meta标签，会给你带来意想不到的效果，meta标签的作用有：搜阅读全文

posted @ 2018-03-04 15:03 自转不息阅读(739) 评论(0) 推荐(0)

CSS： hack 方式一览

摘要：本文引自：http://blog.csdn.net/freshlover/article/details/12132801 什么是CSS hack 由于不同厂商的流览器或某浏览器的不同版本（如IE6-IE11,Firefox/Safari/Opera/Chrome等），对CSS的支持、解析不一样，导阅读全文

posted @ 2018-03-04 14:35 自转不息阅读(459) 评论(0) 推荐(0)

CSS3： perspective 3D属性

摘要：本文引自：http://blog.csdn.net/cddcj/article/details/52956540 perspective 属性指定了观察者与z=0平面的距离，使具有三维位置变换的元素产生透视效果。z>0的三维元素比正常大，而z<0时则比正常小，大小程度由该属性的值决定。三维元素在观阅读全文

posted @ 2018-03-04 14:23 自转不息阅读(417) 评论(0) 推荐(0)

图片格式：gif / png / pg / webp 介绍

摘要：本文引自：https://www.cnblogs.com/changyangzhe/articles/5718285.html GIF介绍 JPG介绍 PNG介绍三种图片格式应用最后：介绍WEBP格式阅读全文

posted @ 2018-03-04 12:13 自转不息阅读(2361) 评论(0) 推荐(0)

CSS：抗锯齿 font-smoothing

摘要：本文引自：http://www.cnblogs.com/sunshq/p/4595673.html -webkit-font-smoothing 这个属性可以使页面上的字体抗锯齿,使用后字体看起来会更清晰舒服。加上之后就顿时感觉页面小清晰了。淘宝也在用哦！它有三个属性： none 对低像素的文阅读全文

posted @ 2018-03-04 12:04 自转不息阅读(296) 评论(0) 推荐(0)

转载 | 缩小浏览器窗口右边出现空白

摘要：本文引自：http://blog.csdn.net/gyy93/article/details/70905405 布局做好的页面不会因为缩小浏览器窗口而右边出现空白？“发现现在缩小窗口，底部出现进度条，滑动至右边，就出现空白”这个问题是个十分常见且容易忽略的bug。原因是因为出现空白的元素设置了宽度阅读全文

posted @ 2018-03-04 01:46 自转不息阅读(716) 评论(0) 推荐(0)

转载 | SVG向下兼容优雅降级方法

摘要：本文引自：http://www.zhangxinxu.com/wordpress/2013/09/svg-fallbacks/ 1.svg image标签降级技术如果浏览器支持SVG，则SVG显示；对于不支持的浏览器，例如IE8浏览器，会忽略svg标签的存在，直接渲染image，在其看来，这就是个阅读全文

posted @ 2018-03-04 00:26 自转不息阅读(223) 评论(0) 推荐(0)

CSS等分布局方法

摘要：原文链接：http://caibaojian.com/css-equal-layout.html CSS等比例划分，在CSS布局中是比较重要的，下面分享几种常用方法和探讨一下兼容性。一：浮动布局+百分比该样式兼容性较好，但是无法实现当里面的列增多时比例也随着变化，必须手动修改，当然你也可以使用一阅读全文

posted @ 2018-02-13 17:51 自转不息阅读(352) 评论(0) 推荐(0)

如何用实现文字环绕图片？

摘要：方法1-CSS实现：直接對著圖片設置 float 就可以了這樣你把圖片插入在哪行，它就會以那行為基準貼齊右側存在问题：当把中间的文字替换成连续的英文字母时，文字不换行问题原因：浏览器默认解析英文或者数字时，是按照单词进行解析。也就是说，每个单词是一个整体，遇到空间不足时，不会对单词进行拆分。阅读全文

posted @ 2018-02-09 12:00 自转不息阅读(1593) 评论(0) 推荐(0)

转载 | 网页中返回顶部代码(多种方法)

摘要：1. 最简单的静态返回顶部，点击直接跳转页面顶部，常见于固定放置在页面底部返回顶部功能方法一：用命名锚点击返回到顶部预设的id为top的元素 <a href="#top" target="_self">返回顶部</a> 方法二：操作scrooll函数用来控制滚动条的位置（第一个参数是水平位置，第二阅读全文

posted @ 2017-09-06 12:32 自转不息阅读(251) 评论(0) 推荐(0)

转载 | 如何给网页标题添加icon小图标

摘要：打开某一个网页会在浏览器的标签栏处显示该网页的标题和图标，当网页被添加到收藏夹或者书签中时也会出现网页的图标，怎么在网页title左边显示网页的logo图标呢？方法一（被动式）：制作一个ico格式的图片，将图片命名为favicon.ico，像素大小为16*16，所使用的颜色不得超过16色，然后再阅读全文

posted @ 2017-08-21 17:16 自转不息阅读(866) 评论(0) 推荐(0)

转载 | textarea 在浏览器中固定大小和禁止拖动

摘要：HTML 标签 textarea 在大部分浏览器中只要指定行（rows）和列（cols）属性，就可以规定 textarea 的尺寸，大小就不会改变，不过更好的办法是使用 CSS 的 height 和 width 属性,但是Chrome,Safari和FireFox渲染的效果不同，可以拖动右下角图标改阅读全文

posted @ 2017-08-21 16:05 自转不息阅读(366) 评论(0) 推荐(0)

转载 | embed用法（网站中视频、音频的添加）

摘要：网站中添加视频： Embed （一）、基本语法： embed src=url 说明：embed可以用来插入各种多媒体，格式可以是 Midi、Wav、AIFF、AU、MP3等等， Netscape及新版的IE 都支持。url为音频或视频文件及其路径，可以是相对路径或绝对路径。示例：<embed sr 阅读全文

posted @ 2017-08-19 16:13 自转不息阅读(1200) 评论(0) 推荐(0)

转载 | 如何实现模块半透明文字内容不透明？

摘要：两种方法一种是用background:rgba(0, 0, 0, 0.5),兼容性只支持IE8往上另一种方法使用透明度要考虑IE8往下可以用这个：阅读全文

posted @ 2017-08-18 22:12 自转不息阅读(240) 评论(0) 推荐(0)

转载 | 一种让超大banner图片不拉伸、全屏宽、居中显示的方法

摘要：现在很多网站的Banner图片都是全屏宽度的，这样的网站看起来显得很大气。这种Banner一般都是做一张很大的图片，然后在不同分辨率下都是显示图片的中间部分。实现方法如下：把css中 .bannerbox 中 height 及 .banner 和 width 换成你banner图的大小，然后 .b 阅读全文

posted @ 2017-08-18 16:00 自转不息阅读(494) 评论(0) 推荐(0)

自转不息

随笔分类 - HTML/CSS