好用的6个css方法
1. 黑白图像
img {
filter: grayscale(100%);
}
2. 使用 :not() 除它之外的其他元素
.nav li:not(:last-child) {
border-right: 1px solid #333;
}
3. 所有一切都垂直居中
html, body {
height: 100%;
margin:;
}
body {
align-items: center;
display: flex;
}
4. 表格单元格等宽
.calendar {
table-layout: fixed;
}
5. 文本渐变
h1{
position: relative;
}
h1:after{
content: '与h1内容相同文字';
z-index:;
color: #e3e3e3;
position: absolute;
top:;
left:;
-webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0)), color-stop(50%, rgba(0,0,0,1)), to(rgba(0,0,0,0)));
}
6. 禁用鼠标事件
.disabled {
pointer-events: none;
}
好用的6个css方法的更多相关文章
- 复习练习(03)jquery Css方法一步步升级
jquery Css方法一步步升级 <script src="jquery-1.8.3.js"></script> <script type=&quo ...
- JQUERY操作css与css()方法、获取设置尺寸;
一.jQuery addClass() 方法 向不同的元素添加 class 属性.在添加类时,您也可以选取多个元素 <style> .aa { color:red; }; </sty ...
- JQuery:JQuery 中的CSS()方法
JQuery:CSS()方法jQuery css()方法:css()方法设置或返回被选元素的一个或多个样式属性.1.返回 CSS 属性如需返回指定的 CSS 属性的值,请使用如下语法:css(&quo ...
- Jquery中css()方法获取边框长度
1. JQuery中可以使用css()方法获取块元素的边框宽度,如下: $("divMode").css("border-left-width");//左边框长 ...
- jQuery HTML CSS 方法
jQuery HTML / CSS 方法 下面的表格列出了所有用于处理 HTML 和 CSS 的 jQuery 方法. 下面的方法适用于 HTML 和 XML 文档.除了:html() 方法. 方法 ...
- jQuery的css()方法
jQuery的css()方法下面的代码可以为div一次性设置多个样式属性<!DOCTYPE html><html><head><meta charset=&q ...
- 动态加载css方法实现和深入解析
一.方法引用来源和应用 此动态加载css方法 loadCss,剥离自Sea.js,并做了进一步的优化(优化代码后续会进行分析). 因为公司项目需要用到懒加载来提高网站加载速度,所以将非首屏渲染必需 ...
- 文本超出显示省略号/数字英文字母折行有关css 属性/显示两行,第二行省略号显示css方法
文本超出显示省略号: 定容器宽度 overflow: hidden; text-overflow: ellipsis; 文本超出显示省略号 white-space:nowrap; 强制文本不换行 折 ...
- jQuery 学习03——HTML:捕获、设置、添加元素、删除元素、CSS类、CSS()方法、尺寸
jQuery - 获取内容text().html() 以及 val()和属性attr() jQuery 中非常重要的部分,就是操作 DOM 的能力. DOM = Document Object Mod ...
- jQuery CSS()方法改变CSS样式实例解析
转自:http://www.jbxue.com/article/24588.html 分享一个jQuery入门实例:使用CSS()方法改变现有的CSS样式表,css()方法在使用上具有多样性.其中有一 ...
随机推荐
- 1.继承(extends)、超类(superClass)、子类(subClass)
注意:继承主要使用的is-a关系 在子类中用一个新的方法来覆盖超类中的方法(override),需要注意的是如果子类之中的方法或者域 被覆盖时,仍然想访问superClass中的方法和域,此时必须使 ...
- Winform中Picture控件图片的拖拽显示
注解:最近做了一个小工具,在Winform中对Picture控件有一个需求,可以通过鼠标从外部拖拽图片到控件的上,释放鼠标,显示图片! 首先你需要对你的整个Fom窗口的AllowDrop设置Ture ...
- 《XX重大技术需求征集系统》的可用性和可修改性战术分析
题目:阅读<大型网站技术架构:核心原理与案例分析>第五.六章,结合<某重大技术需求征集系统>,列举实例分析采用的可用性和可修改性战术,将上述内容撰写成一篇1500字左右的博客阐 ...
- vue day8 table page
@{ ViewBag.Title = "Home Page"; Layout = null; } <!DOCTYPE html> <html> <he ...
- 爬虫模块介绍--request(发送请求模块)
爬虫:可见即可爬 # 每个网站都有爬虫协议 基础爬虫需要使用到的三个模块 requests 模块 # 模拟发请求的模块 PS:python原来有两个模块urllib和urllib的升级urlli ...
- 使用 Flask-Docs 自动生成 Api 文档
影响我写文档的原因可能是代码和文档分离,有时候写完代码会忘记补文档,而且不能及时查看,使用 Flask-Docs 可以解决我的问题,这个插件可以根据代码注释生成文档页面,代码注释改动文档可以及时更新, ...
- Centos7 + Python3.6 + Django + virtualenv + gunicorn + supervisor 环境配置详解
跟着网上的教程走发现行不通阿!好多都是写个大概,而且每人的环境都是有些许差异的,比如说权限问题阿,等等都会造成安装的失败 说明:本教程在你已经拥有Centos7系统,已经安装好nginx服务器,已经安 ...
- ie 9.10 兼容性问题 遇到的坑
1.ie9 中ajax 跨域调用时 error报错信息为”No Transport” 原因是 ajax跨域 本人用的是 cors解决方案 但是ie9一下版本 对cors默认是不允许的所以需要我们自 ...
- java-新建简单的Web项目
参考链接: https://www.cnblogs.com/silentdoer/articles/7134332.html web.xml: <?xml version="1.0&q ...
- C语言堆栈入门——堆和栈的区别(转)
一.预备知识—程序的内存分配 一个由C/C++编译的程序占用的内存分为以下几个部分 1.栈区(stack)— 由编译器自动分配释放 ,存放函数的参数值,局部变量的值等.其 操 ...