一、CSS的三种使用方式：1. 内联样式 * 在标签内使用style属性指定css代码 * 如：<div style="color:red;">hello css</div>2. 内部样式 * 在head标签内，定义style标签，style标签的标签体内容就是css代码 * 如： <style> div{ color:blue; } </style> <div...
CSS是Cascading Style Sheets的缩写。即层叠样式表，它用于表现HTML的样式，即HTML仅仅是去写该网页有哪些内容，至于怎样去表现它们，由CSS去定制。 *************时代的呼唤*************1.在之前，我们直接把网页的格式写到HTML中去，这样会造成格式的混乱，并且难以阅读和改动，只是这不是最大的问题，最大的问题在于我们想给网页换一个表达样式的时候，须要改动的地方不仅非常多关键是非常零散，须要花费非常大的力气去定位这些...
此文章仅为转发，非原创，原文http://www.cnblogs.com/zhuanggege/p/5754543.html请支持原创 css3动画@keyframes规定动画，必须定义动画的名称，动画时长的百分比，一个或多个css样式属性以百分比来规定改变发生的时间，或者通过关键词"from"和"to"，等价于0%和100%语法：@keyframes animationname {keyframes-selector {css-styles;}}animation是一个简写属性，用于设置六个动画属性：animation-name规定@keyframes动画的名称anim...
1、行内元素居中 line-height（须知高度）.box{height:300px; } p{line-height:300px; } 2、table居中 display:table-cell;vertical-align:middle;.box{display:table; } p{display: table-cell;vertical-align: middle; } 3、绝对定位，top+margin-top:-xxpx（须知高度）.box{position:relative; } p{position:absolute;top:50%;margin-top:-50px; width:100px;height:100px; }4、绝对定位 top+tranform.box{p...
1 height:auto;min-height:100%;使得最小高度为屏幕高度。2 -webkit-tap-highlight-color:rgba(0,0,0,0);避免移动端点击事件出现背景框3 text-decoration：underline/overline/line-through; 定义文本上的下划线/上划线/中划线原文：http://www.cnblogs.com/yunrundetizi/p/5176943.html
CSS实现圆角，三角，五角星，五边形，爱心，12角星，8角星，圆，椭圆，圆圈，八卦等等新出的html5新增了不少标签，性能更强，原来的很繁琐的功能几个标签就能实现，同时CSS3也推出，更是一大亮点，下面是css3的一切用法，在此总结一下，以供需要的朋友们，总共30个例子1.长方形#Rectangle{width: 200px;height: 50px;background-color: red;color: white;text-align: center;}2.正方形#square{width: 200px;height: 200px;backgrou...
@-webkit-keyframes swing {20%, 40%, 60%, 80%, 100% { -webkit-transform-origin: top center; }20% { -webkit-transform: rotate(15deg);}40%{-webkit-transform: rotate(-10deg);}60%{-webkit-transform: rotate(5deg);}80%{-webkit-transform: rotate(-5deg);}100%{-webkit-transform: rotate(0deg);}} @-moz-keyframes swing {20% { -moz-transform: rotate(15deg); }40% { -moz-transform: rotate(-10deg); }60% { -moz-tra...
/*check,radio*/ input.check_txt[type=‘checkbox‘]{display: none; }input.check_txt[type=‘checkbox‘] + label{display: block;float: left;-moz-appearance: none;-webkit-appearance: none;width: 20px;height: 20px;background: #fff;border:2px solid #cecece;border-radius: 3px; cursor:pointer; }input.check_txt[type=‘checkbox‘]:checked + label {background: #f0f0f0 url(../images/check.png) no-repeat cent...
css作用：控制网页的样式 css语法：选择符{属性1：属性值；属性2：属性值；属性3：属性值1 属性值2 属性值3；} css实例： div{ width:300px; height:400px; background:red; } css语法解释： 1、选择符：对标签进行获取 2、所有声明都放在大括号里面，声明和声明之间用分号（“；”）连接 3、声明包括属性及属性值，属性和属性值之间用冒号连接 4、如果一个属性拥有多个属性值，属性值之间用空格隔开 例：border（边框）:10px(像...
CSS的核心：浮动、盒子模型、定位DIV作为块级元素，每个DIV占据一行。 块元素特点：1.默认显示在父标签的左上角；2.会计元素默认占满一行（占满整个文档流） 常见的块级元素：p、h1-h6、ul li、ol li、div、table、hr等 相对应的是行内元素（内联元素）：a、span、img、input等 行内元素特点：1.大小受到文字区域影响，不受height、width影响；2.不会单独占据一行。 span标签的应用：不会单独占满一行，不会受到其他块级...
今天看了张鑫旭大佬的新书的有感吧，记录一下。Web标准未对一些场景做出明确规范，所以各大浏览器厂家只能根据自己的理解和喜好去实现，表现差异不是浏览器的bug，用计算机领域的术语描述为"未定义行为"。比如一个例子： CSS中的一个伪类，最常用的一个伪类:active，鼠标按下，执行改伪类对应的CSS样式，鼠标抬起还原。但是这种情况呢：<!DOCTYPE html> <html> <head><meta charset="utf-8" /><style>.active-btn {display: inline...
CSS盒子模型：由四个属性组成的外边距(margin)、内边距(padding)、边界(border)、内容区(width和height);标准的CSS盒子模型和低端IE CSS盒子模型不同：宽高不一样 标准的css盒子模型宽高就是内容区宽高； 低端IE css盒子模型宽高 内边距﹢边界﹢内容区；原文：http://www.cnblogs.com/love-sea520/p/5903442.html
CSS学起来并不难，但在大型项目中，就变得难以管理，特别是不同的人在CSS书写风格上稍有不同，团队上就更加难以沟通，为此总结了一些如何实现高效整洁的CSS代码原则： 1. 使用Reset但并非全局Reset 不同浏览器元素的默认属性有所不同，使用Reset可重置浏览器元素的一些默认属性，以达到浏览器的兼容。但需要注意的是，请不要使用全局Reset：鞍山治疗牛皮癣的医院www.0412n.com *{ margin:0; padding:0; } 这不仅仅因为...
(壹)常用的CSS命名规则头:header内容:content/container尾:footer导航:nav侧栏:sidebar栏目:column页面外围控制整体布局宽度:wrapper左右中:left right center登录条:loginbar标志:logo广告:banner页面主体:main热点:hot新闻:news下载:download子导航:subnav菜单:menu子菜单:submenu搜索:search友情链接:friendlink页脚:footer版权:copyright滚动:scroll内容:content标签页:tab文章列表:list提示信息:msg小技巧:tips栏目标题:title...
主要内容：1. HTML标签：表单标签2. CSSHTML标签：表单标签* 表单： * 概念：用于采集用户输入的数据的。用于和服务器进行交互。 * form：用于定义表单的。可以定义一个范围，范围代表采集用户数据的范围 * 属性： * action：指定提交数据的URL * method:指定提交方式 * 分类：一共7种，2种比较常用 ...