width:(宽度)

height:(高度)

border:1px solid red;(边框 :边框粗细 显示 颜色)

border-radius:10deg;(边框变圆角)

box-shadow:10px 10px 10px red;(div盒子阴影:右侧阴影10px,下侧阴影10px,淡化拉伸阴影10px,阴影颜色;为负值时位置相反)

background-color:(背景颜色)

background-image:url()(背景图片)

background-size:(背景尺寸)

background-repeat:no repeat(背景平铺:不平铺)

background-position: top / bottom / left/ right;(背景位置:上下左右)

color:(字体颜色)

font-size:(字体尺寸大小)

font-style:(字体格式)

font-weight:(字体宽度)

font-decoration:underline(字体标注:下划线)

text-align:(字体水平位置)

display:table-cell;(字体垂

vertical-align:     ;直位置)

<p style=“text-indent:40em;”>(字体首行缩进:40em     1em等于两个字符宽度)

——————————————————————————————————————————————————————————————————————

*{         (页面格式化)

margin:0 auto;

padding: 0;

}

——————————————————————————————————————————————————————————————————————

.class{                                         (对上面的

clear:both;                          浮动格式

}                                                     的影响进

<div class="clear"> </div>             行清除)

——————————————————————————————————————————————————————————————————————

div:hover{                                                 (当鼠标放上时

cursor:pointer;                         变小手

background-img:url()             更换背景图片

}

——————————————————————————————————————————————————————————————————————

<ol>                        (有                                  <ul>                    (无

<li></li>              序                                        <li></li>            序

<li></li>              列                                        <li></li>            列

</ol>                          表)                               <ul>                       表)

——————————————————————————————————————————————————————————————————————

div{

animation:name    5s   infinite    alternate;    ( 动画:名称;运行一遍所需时间;循环播放;交互播放)

}

@keyframes name{

0%{    }          (运行至0%时div的样式)

50%{    }        (运行至50%时div的样式)

100%{    }      (运行至100%时div的样式)

}

——————————————————————————————————————————————————————————————————————

css代码整理的更多相关文章

  1. css代码整理、收集

    整理了一下之前用到过的css代码,实现一种效果或许有许多种写法,我这里整理了一下我个人认为兼容性比较好,结构比较简洁的代码……如有写得不对的地方敬请前辈们指点赐教一下,小弟不胜感激!此学习笔记是动态的 ...

  2. 转载网易博客:整理各大网站让网站变灰的css代码

    2013-07-21 15:06:47 北京时间2013年4月20日8时02分四川省雅安市芦山县(北纬30.3,东经103.0)发生7.0级地震.震源深度13公里.各大网站将其网站变灰,本人整理了下部 ...

  3. 在sublimen中整理CSS代码及其兼容性问题

    1,使用鼠标选中前面浅灰色缩进. 2,Ctrl+H 查找替换  点击 Find All 查找全部缩进. 3,按backspace向后删除两次,如下图所示: 4,向下按一次方向键,再向左按一次方向键,最 ...

  4. html Css PC 移动端 公用部分样式代码整理

    css常用公用部分样式代码整理: body, html, div, blockquote, img, label, p, h1, h2, h3, h4, h5, h6, pre, ul, ol, li ...

  5. div+css通用兼容性代码整理

    一.Div+css通用兼容性代码 你可以在css开头加入 *html{padding:0px} <style> *html{padding:0px} /* Clear Fix */ .cl ...

  6. 整理及优化CSS代码的7个原则

    作为网页设计师(前端工程师),你可能还记得曾经的那个网页大小建议:一个网页(包括HTML.CSS.Javacript.Flash和图片)尽量不要超过30KB的大小,随着互联网的日益庞大,网络带宽也在飞 ...

  7. [No00007B]DreamweaverCC 的CSS代码格式化

    Dreamweaver自带的代码格式化功能. 1.步骤:命令 -> 应用源格式. 2.你可以选择你的偏好.特别是css代码,有些人喜欢每个属性单独一行,有些人喜欢把所有属性写在同一行.步骤:编辑 ...

  8. 如何写出优雅的CSS代码 ?(转)

    对于同样的项目或者是一个网页,尽管最终每个前端开发工程师都可以实现相同的效果,但是他们所写的代码一定是不同的.有的优雅,看起来清晰易懂,代码具有可拓展性,这样的代码有利于团队合作和后期的维护:而有的混 ...

  9. 如何写出优雅的css代码 ?

    如何写出优雅的css代码 ? 对于同样的项目或者是一个网页,尽管最终每个前端开发工程师都可以实现相同的效果,但是他们所写的代码一定是不同的.有的优雅,看起来清晰易懂,代码具有可拓展性,这样的代码有利于 ...

随机推荐

  1. Java 第三章 选择结构

    第三章   选择结构 if基本语法: if(条件){// 表达式 // 代码块 } eg: int a = 10; if(a > 1){ System.out.println("内容& ...

  2. ACM1007

    题目:DNA序列排序 DNA序列由一序列的大写英文字母表示,如ABCDEF.紊乱程度表示组成DNA序列的字母按照由小到大的顺序进行排列程度,如ABC的紊乱程度比ACB小,因为它字母都是由小到大排序的. ...

  3. freemarker中的round、floor和ceiling数字的舍入处理(十七)

    1.简易说明 (1)round:四舍五入 (2)floor:向下取整 (3)ceiling:向上取整 2.举例说明 <#--freemarker中的round.floor和ceiling数字的舍 ...

  4. img 标签 访问图片 返回403 forbidden问题

    之前在项目里,本地调试的时候,图片src引用了第三方网站的图片资源,导致控制台出现了如下的报错: 403 forbidden,说明了这个网络资源这样获取是被拒绝的,那么通过简单的百度,找到了相关的解决 ...

  5. 搭建web服务器-tomcat+apache+mysql+eclipse

    1. 下载并安装jdk 注意环境变量的配置: java_home: jdk的路径  path:.;%java_home%\bin;%java_home%\jre\bin classpath :  .; ...

  6. jquery实例权威指南

    jquery的$(function(){}) 效率高于window.onload,前者页面框架加载完就执行,后者全部加载完毕且图片下载完毕后方可执行.且前者可以写多个,每次执行结果不同,后者的话尽管可 ...

  7. 关于html中图片上传预览的实现

    本地图片预览 第一种方法 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type& ...

  8. 【Learning】带花树——一般图最大匹配

    一般图最大匹配--带花树 问题 ​ 给定一个图,求该图的最大匹配.即找到最多的边,使得每个点至多属于一条边. ​ 这个问题的退化版本就是二分图最大匹配. ​ 由于二分图中不存在奇环,偶环对最大匹配并无 ...

  9. Dapper一个和petapoco差不多的轻量级ORM框架

    我们都知道ORM全称叫做Object Relationship Mapper,也就是可以用object来map我们的db,而且市面上的orm框架有很多,其中有一个框架 叫做dapper,而且被称为th ...

  10. 从AngularJS2谈到前台开发工程化

    才刚刚对AngularJS有些了解,又听闻AngularJS2早就铺天盖地了,AngularJS3刚刚夭折,AngularJS4今年已经发布了,还是学习先下AngularJS2吧,据说更加适合以移动为 ...