CSS随记
在CSS中,任何元素都可以浮动。浮动元素会生成一个块级框,而不论它本身是何种元素。如果浮动非替换元素,则要指定一个明确的宽度;否则,它们会尽可能地窄。
注释:float属性不具有继承特性,就是说子元素不会继承父元素的浮动属性。
在一行之上只有极少的空间可供浮动元素,那么这个元素会跳至下一行,这个过程会持续到某一行拥有足够的空间为止。
- clear 属性定义了元素的哪边上不允许出现浮动元素。不论哪一种改变,最终结果都一样,如果声明为左边或右边清除,会使元素的上外边框边界刚好在该边上浮动元素的下外边距边界之下。
- position 这个属性定义建立元素布局所用的定位机制。任何元素都可以定位,不过绝对absolute或fixed流中的默认位置偏移.
注释:
relative(相对定位) 对象不可层叠、不脱离文档流,参考自身静态位置通过 top,bottom,left,right 定位,并且可以通过z-index进行层次分级。
absolute(绝对定位) 脱离文档流,通过 top,bottom,left,right 定位。选取其最近一个最有定位设置的父级对象进行绝对定位,如果对象的父级没有设置定位属性,absolute元素将 以body坐标原点进行定位,可以通过z-index进行层次分级。
fixed(固定定位) 这里所固定的参照对像是可视窗口而并非是body或是父级元素。可通过z-index进行层次分级。
margin:10px 5px 15px 20px;
- 上外边距是 10px
- 右外边距是 5px
- 下外边距是 15px
- 左外边距是 20px
- 当在html中引用外部样式表后,那么在样式表文件中定义的样式就相当于在html头文件中定义的样式了。但事实证明并非如此,它依然存放在定义的文件中被一起下载到客户端。这一点从background-image的url属性定义的实践上也可以清楚地看出,在定义url时,如果是绝对地址当然没什么问题,如果是相对地址,那么,一定要相对style.css所在的路径,而不必考虑即将引用它的html文件的路径。
PS:background-image:url(../pic/logo.jpg)
- background-position:{位置值} 属性设置背景图像的起始位置。
使用百分数定位时,其实是将背景图片的百分比指定的位置和元素的百分比位置对齐。也就是说,百分数定位是改变了背景图和元素的对齐基点。不再像使用像素和关键词定位时,使用背景图和元素的左上角为对齐基点。例如上例的background-position: 100% 50%; 就是将背景图片的100%(right) 50%(center)这个点,和元素的100%(right) 50%(center)这个点对齐.
使用数值需要注意的是,当只有一个数值时,这个值将用于横坐标,纵坐标将默认是50%。
text-indent:-999px;
就是把该元素内的文字移到屏幕外面去,让我们肉眼看不见,有时候是因为如某栏目名称的文字或者logo的文字已经用背景图片代替了,我们不需要眼睛看见那些文字,但是希望搜索引擎可以搜到,就可以用这个把文字“隐藏”的属性。虽然眼睛看不见,但是搜索引擎或者盲人用的软件能知道。
cursor:pointer;
把这个样式的值赋给某一元素后,当鼠标移到该元素上,鼠标变为手的形状。- label 元素不会向用户呈现任何特殊效果。不过,它为鼠标用户改进了可用性。如果您在 label 元素内点击文本,就会触发此控件。就是说,当用户选择该标签时,浏览器就会自动将焦点转到和标签相关的表单控件上。<label> 标签的 for 属性应当与相关元素的 id 属性相同。
- 只添加属性名称该属性就会生效应该使用prop();只存在true/false的属性应该使用prop()。
为什么不直接写宋体,而是这样‘\5b8b\4f53’用?
当你的:网页、css 编码是 utf8 时,某些情况下直接写:宋体、微软雅黑之类的中文字体名字,会出现不能识别导致字体设置失效的问题,如果把字体名字转成对应编码如:‘\5b8b\4f53’,就不会出现这个问题。CSS border-collapse 属性
border-collapse 属性设置表格的边框是否被合并为一个单一的边框,还是象在标准的 HTML 中那样分开显示。
CSS随记的更多相关文章
- css狂记
接着上一篇 html狂记,同样是DIV+CSS传统站点开发,同样只是收集.整理... CSS 背景属性(Background) 属性 描述 CSS background 在一个声明中设置所有的背景属性 ...
- html.css随便记
css 绝对定位:一个元素绝对定位时,浏览器首先将它从流中完全删除,然后浏览器再把这个元素放在属性指定的位置上,对其他元素没有影响 绝对定位要相对于最近的父级元素进行定位 position: ab ...
- div+css布局记扎
实际开发网站过程中边碰壁边积累了一些div+css布局相关的小技巧,在这里做一些整理与大家一起探讨.本文章将间歇性更新. 1.div+css布局综述 div+css布局个人观点就是“盒子套盒子”的关系 ...
- CSS 随记
伪类选择符的顺序:L-V-H-A CSS提供了四种元素设置链接的颜色,包括:link.:visited.:hover.:active,它们的声明是有一定顺序的,我们简称这种顺序为L-V-H-A,即li ...
- css随记02布局
布局 二栏布局 利用absolute, margin .container { position: relative; } nav { position: absolute; left: 0px; w ...
- css随记01编辑技巧,背景与边框
代码优化 一个按钮的例子,使其值同比例变化; button{ color: white; background: #58a linear-gradient(#77a0bb, #58a); paddin ...
- css 坑记
1. div 内容超出 (做换行处理) 要注意 white-space属性的运用 设置 div width:100%;(或者固定值) 设置换行 word-break: break-all; 设置 ...
- webstorm之js,css文件压缩
不说废话了,代码压缩是每个网站上线前的必备过程,但由于有时候小的项目或者加急的项目每次都构建一次类似gulp或者grunt等前端部署,实在是大题小做,所以才有了今天这个帖子: 我们会用到yui com ...
- [ZZ] [精彩盘点] TesterHome 社区 2018年 度精华帖
原文地址: https://testerhome.com/topics/17646 相逢即是缘分,总有一篇适合您! 感觉好的请点赞收藏 ,感觉分类不严谨的,欢迎反馈给我! 测试方法&测试管理 ...
随机推荐
- input type file onchange上传文件的过程中,遇到同一个文件二次上传无效的问题。
不要采用删除当前input[type=file]这个节点,然后再重新创建dom这种方案,这样是不合理的.解释如下:input[type=file]使用的是onchange去做,onchange监听的为 ...
- [汇编语言]-第九章 在屏幕中间分别显示绿底红色,白底蓝色字符串"welcome to masm!"
;在屏幕中间分别显示绿色,绿底红色,白底蓝色字符串"welcome to masm!" assume cs:codesg,ds:datasg,ss:stacksg datasg s ...
- Vue.js实现拼图游戏
Vue.js实现拼图游戏 之前写过一篇<基于Vue.js的表格分页组件>的文章,主要介绍了Vue组件的编写方法,有兴趣的可以访问这里进行阅读:http://www.cnblogs.com/ ...
- 【STM32】用DMA实现多路ADC通道数据采集
今天尝试了下STM32的ADC采样,并利用DMA实现采样数据的直接搬运存储,这样就不用CPU去参与操作了. 找了不少例子参考,ADC和DMA的设置了解了个大概,并直接利用开发板来做一些实验来验证相关的 ...
- Java Script 中 ==(Equal) 和 === (Identity Equal) 的区别和比较算法逻辑
判断两个变量是否相等在任何编程语言中都是非常重要的功能. JavaScript 提供了 == 和 === 两种判断两个变量是否相等的运算符,但我们开始学习的时候 JavaScript 的时候,就被一遍 ...
- ca 证书、签名
1.我现在没有个人CA证书,使用.中信建投网上交易,是如何保障安全的呢? 如果您目前没有个人CA证书,使用.中信建投网上交易,系统其实也是用CA证书的RSA体系进行加密的. 您在输入账户和密码进行登录 ...
- aliyun.com
https://help.aliyun.com/knowledge_detail/39495.html?spm=5176.7839494.2.1.AhdvPM
- STM32F103控制两个步进电机按照一定转速比运动
这个暑假没有回家,在学校准备九月份的电子设计竞赛.今天想给大家分享一下STM32定时器控制两个步进电机按照一定速度比转动的问题. 这次做的05年的电子设计竞赛题目,运动悬挂系统..本实验是控制两个步进 ...
- #pragma pack(n) 的作用
在C语言中,结构是一种复合数据类型,其构成元素既可以是基本数据类型(如int.long.float等)的变量,也可以是一些复合数据类型(如数组.结构.联合等)的数据单元.在结构中,编译器为结构的每个成 ...
- 【男性身材计算】胸围=身高*0.48(如:身高175cm的标准胸围=175cm*0.61=84cm);腰围=身高*0.47(如:身高175c… - 李峥 - 价值中国网
[男性身材计算]胸围=身高*0.48(如:身高175cm的标准胸围=175cm*0.61=84cm):腰围=身高*0.47(如:身高175c- - 李峥 - 价值中国网 李峥:[男性身材计算]胸围=身 ...