css小知识
7.
span {
display:inline-block;
width:70px;
/* 超出长度以...显示 */
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
vertical-align: middle;
}
1.table
和并列:colspan=“2”
合并行:rowspan="3"
border-collapse 属性设置是否将表格边框折叠为单一边框:
table
{
border-collapse:collapse;
}
border-spacing 属性设置相邻单元格的边框间的距离(仅用于“边框分离”模式)。
table
{
border-collapse:separate;
border-spacing:10px 50px;
}
2.选择器
1)选择器
$(".pull-right.pagination").css("float","none").css("text-align","center");
2)后代选择器,规则左边的选择器一端包括两个或多个用空格分隔的选择器。选择器之间的空格是一种结合符(combinator)。每个空格结合符可以解释为“... 在 ... 找到”、“... 作为 ... 的一部分”、“... 作为 ... 的后代”。
h1 em {color:red;}
$(".pull-right .pagination").css("float","none").css("text-align","center");
3)子选择器
某个元素的子元素
h1 > strong {color:red;}
4)兄弟选择器
选择紧接在另一个元素后的元素,而且二者有相同的父元素
h1 + p {margin-top:50px;}
3.属性声明
相关的属性声明应当归为一组,并按照下面的顺序排列:
Positioning
Box model
Typographic //排版
Visual //视觉
由于定位(positioning)可以从正常的文档流中移除元素,并且还能覆盖盒模型(box model)相关的样式,因此排在首位。盒模型排在第二位,因为它决定了组件的尺寸和位置。
4.z-index
根据规范,z-index是应用到定位元素的,也就是position属性不为relative的元素,否则,设置z-index是没有意义的;
z-index的作用有两点,一是设置在当前堆叠上下文(stacking context)中的层级;二是创建一个新的堆叠上下文;
z-index并不是设置的值越高,就会越靠近用户,还和堆叠上下文有关系;
在不同堆叠上下文中的元素,如果堆叠上下文一距离用户更近,那么它的所有子元素都在另一个堆叠上下文子元素的前面,也就是离用户更近,不同堆叠上下文中的子元素不可能发生交叉。
5.class命名
类名的第一个字符不能使用数字
6." "表示一个空格字符
innerHTML_+="<td><tr>"+row.name+": "+"</tr>"+row.value+"</td><br>";
css小知识的更多相关文章
- 【前端词典】几个有益的 CSS 小知识
今天偷个懒,不长篇大论,分享几个你可能不知道的 CSS 小知识. 样式的顺序 CSS 代码: HTML 代码: 记得之前这是一道比较火的 CSS 考题,当时好像是有不少的人答错(30% 以上) ...
- 几个有益的 CSS 小知识
样式的顺序 CSS 代码: HTML 代码: 记得之前这是一道比较火的 CSS 考题,当时好像是有不少的人答错(30% 以上) 答案你们应该是知道的. 可以这样提升 CSS 性能 后代选择器 ...
- 12个你未必知道的CSS小知识
虽然CSS并不是一种很复杂的技术,但就算你是一个使用CSS多年的高手,仍然会有很多CSS用法/属性/属性值你从来没使用过,甚至从来没听说过. 1.CSS的color属性并非只能用于文本显示 对于CSS ...
- 一些常被你忽略的CSS小知识
1.CSS的color属性并非只能用于文本显示 对于CSS的color属性,相信所有Web开发人员都使用过.如果你并不是一个特别有经 验的程序员,我相信你未必知道color属性除了能用在文本显示,还可 ...
- HTML、CSS小知识--兼容IE的下拉选择框select
HTML <div class="s_h_ie"> <select id="Select1" disabled="disabled& ...
- 你未必知道的css小知识
1:当按百分比设定一个元素的宽度时,它是相对于父容器的宽度计算的,但是,对于一些表示竖向距离的属性,例如padding-top,padding-bottom,margin-top,margin-bot ...
- css 小知识
<!-- IE下消除点击图片文字后出现的虚线框代码 --> <style type="text/css">a {blr:expression(this.on ...
- css小知识 2
效果为 为什么还出现出现不同的效果? 浏览器在解析第二个p的时候,因为第二个字母见没有空格,它会认为这是一个单词没有写完,所以不会换行 列表 1.无序列表ul 第二,内部必须有子代标签<li&g ...
- CSS小知识---table表格
所用的仍是bootstrap的模板 <link rel="stylesheet" href="css/bootstrap.min.css"> < ...
随机推荐
- 屌炸天,Oracle 发布了一个全栈虚拟机 GraalVM,支持 Python!
前阵子,Oracle 发布了一个黑科技 "GraalVM",号称是一个全新的通用全栈虚拟机,并具有高性能.跨语言交互等逆天特性,真有这么神奇? GraalVM 简介 GraalVM ...
- yarn组件通信协议简介
ResourceManager与NodeManager通过ResourceTracker协议通信. NodeManager通过NodeStatusUpdaterImpl中的ResourceTracke ...
- Android--UI之ImageView
前言 这篇博客聊一聊在Android下ImageView的使用,在此篇博客中,会讲解到ImageView的一些属性的使用,以及ImageView展示图片的放大.缩小.旋转等操作.最后再讲解一下Andr ...
- Flink从入门到精通系列文章
戳更多文章: 1-Flink入门 2-本地环境搭建&构建第一个Flink应用 3-DataSet API 4-DataSteam API 5-集群部署 6-分布式缓存 7-重启策略 8-Fli ...
- [NewLife.XCode]增量累加
NewLife.XCode是一个有10多年历史的开源数据中间件,支持nfx/netstandard,由新生命团队(2002~2019)开发完成并维护至今,以下简称XCode. 整个系列教程会大量结合示 ...
- 【原创】Python第二章——字符串
字符串是一个字符序列,(提醒:序列是Python的一个重要的关键词),其中存放UNICODE字符.Python中的字符串是不可变的(immutable),即对字符串执行操作时,总是产生一个新的字符串而 ...
- MySQL+MGR 单主模式和多主模式的集群环境 - 部署手册 (Centos7.5)
MySQL Group Replication(简称MGR)是MySQL官方于2016年12月推出的一个全新的高可用与高扩展的解决方案.MGR是MySQL官方在5.7.17版本引进的一个数据库高可用与 ...
- 关于kubernetes使用私有仓库一点说明
一.概述 关于kubernetes使用私有docker image registry的一些说明: 1.对于自己构建的项目镜像或一些不想暴露到外网的image需要使用自建的私有仓库,一般有两种选择:d ...
- SpringBoot学习(四)-->SpringBoot快速入门,开山篇
Spring Boot简介 Spring Boot的目的在于创建和启动新的基于Spring框架的项目.Spring Boot会选择最适合的Spring子项目和第三方开源库进行整合.大部分Spring ...
- backbond整体架构
(function(factory) { // 在这里是backbone模块化的一个接口.支持AMD,CMD和全局变量模式.代码很好理解. })(function(root, factory, _, ...