css书写规 1.空格规范: div { color: red; } 2.选择器规范 3.属性 属性定义要另起一行 属性定义后必须以分号结尾 div { color: red; font-size: 14px; }…

我们在埋头写代码的时候,还要学会收集整理一些常用的代码小技巧,以便在工作时候,可以及时调取,提高工作效率. 今天,我把之前收集整理的一些CSS代码小技巧分享出来,供你参考学习,希望对你有帮助. 一.CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等)2.大小(width, height, padding, margin)3.文字系列(font, line-height, letter-spacing, color- text…

前言 在项目开发中对于css名字的命名和书写老是感觉很混乱,这对于代码的可读性以及维护提出了挑战,所以在闲暇之余看了一些这方面的内容,现总结如下... 1.命名规则说明 所有的命名最好都小写 属性的值一定要用双引号("")括起来,且一定要有值如class="divcss5",id="divcss5" 每个标签都要有开始和结束,且要有正确的层次,排版有规律工整 空元素要有结束的tag或于开始的tag后加上"/" 表现与结构完全分…

1.css(层叠样式表)样式主要目的(让页面更好看些) css尽量不要写内联样式,保证结构和样式分离原则: html专门负责结构,css专门负责样式. 2.css写法规范 选择器  { 属性 :值 : } 内联样式  写在标签里   style=“”属性:值“” 内部样式  写在head标签里的style标签里 外部样式   通过链接导入样式表  link 3.font-size(字号大小) 4.浏览器默认字体font-family 微软雅黑 ,字体大小一般默认为16px 一般不想写中文是可以用…

1.渐进增强,优雅降级 2.浏览器前缀 3.背景渐变   4.css  验证工具 2种方式:第2种支持验证本地的css(推荐) 5.css压缩  ----(节约空间,节省带宽) 6.旋转轮播图 案例: 注意: 1.3d  旋转      3d 的translateZ 2.子盒子要一般要写transform-style属性 更有3d效果 3.过渡做动画 4.父元素透视属性  有3d效果…

1.css用户界面样式 a.鼠标样式(记住几个兼容性好的) cursor:default/pointer/move/text; b.轮廓 outline outline:2px solid red: outline:0/none(取消轮廓线) c.防止拖拽文本域 textarea{resize:none:} d.背景图片和背景颜色一起出现时,背景颜色在最底层. e.行内块和文字对齐 vertical-align  对块级元素不起作用 图片和文字默认基线对齐 f.去除图片底侧空白缝隙 g. 溢出的…

1.文档流介绍 网页布局的核心就是利用css来摆放盒子, 把盒子摆放在合适的位置. css的定位机制有以下3种(网页布局一般需要3种搭配使用): a.普通流(标准流) b.浮动 1.浮动只有左右. 2.浮动后找离他最近的父元素靠左/右对齐. 3.!!!一个父盒子里的子盒子,如果其中一个子元素有浮动的话,则其他子元素都需要浮动,这样才能一行显示. 4.浮动飘在标准流的上面,压住标准流. 5.浮动元素有哪些特性?(浮动影响盒子显示模式) 1.块级元素浮动后会有行内块特性 2.行内元素浮动后也具有行内…

css三大特性 1.层叠性(就近原则) 2.继承性(和文字有关的会继承) 3.优先级   (权重问题) 权重:0,0,0,0 0001 ---标签选择器(注意:即使有20个标签选择器也不会比一个伪类选择器优先级高) 0010  ---类选择器,伪类选择器,属性选择器,伪元素选择器 0100  ---id选择器 1000 ---行内样式 最大的权重: !important eg: color!important;(一旦出现优先级最大) 权重是可以叠加的   对于复合选择器 eg:ul  li   …

css背景属性及其应用 1.背景 2.背景简写 3.背景透明(css3) 4.背景缩放(css3) 5.多背景图片(css3) 6.凹凸文字效果…

css复合选择器 a.交集选择器  (即...又...:选择器之间不能有空格) p.one{color:red;] b.并集选择器(中间由逗号隔开) p,div{color:red;} c.后代选择器(可以选择到所以的子孙后代 :中间用空格隔开) .class h3{color:red} d.子元素选择器(中间用 大括号  >; 选的是儿子,孙子啥的不算) div>span{color:red;} e.属性选择器(用中括号表示) a[title]{color:red;} input[type=…