本文对animate.css的各个效果进行总结bounce从上掉落，在地上小幅度跳起<!DOCTYPE html> <meta charset="utf-8"> <html> <head><title>mode</title><link rel="stylesheet" type="text/css" href="animate.css"><style type="text/css">#mode{margin: 0 auto;width: 300px;height: 100px;text-align: center;line-height: 100px;color: blue;font: 50px "微软雅黑";}</style> </head> <body><div id="mode" class="animated infini...
转自：http://blog.csdn.net/qiushi_1990/article/details/40260447?utm_source=tuicool&utm_medium=referral一，html+css基础1-1Html和CSS的关系学习web前端开发基础技术需要掌握：HTML、CSS、JavaScript语言。下面我们就来了解下这三门技术都是用来实现什么的：1. HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息，可以包含文字、图片、视频等。2. CSS样式是表现。就像网页的外衣。比如，标题字体、颜色...
1.通配选择器匹配所有元素 *{color:red;}2.标签选择器匹配所有p元素 p{color:red;}3.ID选择器匹配ID="div1"的元素 #div1{color:red;}4.类选择器匹配class="red"的元素，CSS和HTML对大小写不敏感，但ID是大小写敏感的。 .red{color:red;} 应用多个class，类名中间用空格隔开，class="red green"。元素将应用red和green的所有规则，重复规则只有一个生效，但不取决于class中类名顺序，而是CSS定义的顺序。 1<!DOCTYPE ht...
1、父级div定义height<style type="text/css"> .div1{background:#000080;border:1px solid red;/*解决代码*/height:200px;}.div2{background:#800080;border:1px solid red;height:100px;margin-top:10px}.left{float:left;width:20%;height:200px;background:#DDD}.right{float:right;width:30%;height:80px;background:#DDD}</style> <div class="div1"> <div class="left">Left</div> <div class="right">Right</div> </di...
最近在弄一个简单管理系统的前端，所以打算将做项目的一些个人感想以及总结简单罗列下，当然，主要针对前端的基础部分以及一些常用的前端个人简单技巧总结。主要分为js部分和css部分，下面是css的基础部分总结 一、基础知识 1、前端基本概念以及常识 web应用，主要分为前端和后端，而前端的话，主要是想用户展示内容，后端的话主要是处理用户数据。前端内容呈现中，主要有几个问题：内容是什么？如何展示内容？如何展示...
1.对WEB标准以及W3C的理解与认识 标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件，容易维护、改版方便，不需要变动页面内容、提供打印版本而不需要复制内容、提高网站易用性; 2.xhtml和html有什么区别 HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的置标语...
一个div里面有多个相同的元素的时候给头 或者尾部的元素去掉某些样式的时候用 first-child 给第一个元素去掉某个元素 last-child 给末尾的去掉 今天制作海豚家使用最多的就是 position:fixed 搭配 top bottom left regiht来使用固定在页面上，制作抖动动画使用到relative margin 和relative 定位的区别 margin会影响后继元素的布局 而relative不会. 原文：https://www.cnblogs.com/wzsoul/p/14967428.html
学习前端有一段时间了，一直在看书上的理论知识，而实战项目却很少。师兄常说，想要知道自己的实力有多少，知识掌握了多少，最好的方法就是去实践了，实践出真知嘛。于是决定在这个假期里，主要是通过项目的实践以及理论知识的辅助来提高代码水平。首先是做几个HTML5+CSS3静态页面布局的练习，查缺补漏知识点并且总结在实践过程中遇到的一些错误。页面的设计稿主要是网络上找来了的，也尝试自己切图、测量位置、获得内容的属性等等...
为什么要转过来呢？ 因为我觉到，同样是一个初学者，应该互相学习，交流。 css：Cascading Style Sheets 层叠样式表CSS引入方式：1.内嵌： <p style="color:red;">xx</p>，这种方式使用最少，因为不方便阅读2.内联：写在<head>中，<style> p{xxxxx} </style> 所有p元素都会执行{}中的代码。3.外联：在外部创建一个CSS，再通过link连接这个css.也写在<head>中。选择器:1....
1、border-radius:圆角效果 （1）border-radius:5px 5px 5px 5px ;如果有4个参数，代表4个角 （2）border-radius:5px 5px；2个参数，代表top-left,bottom-rigt和top-right,bottom-left; （2）border-radius:5px 5px 5px；3个参数，代表top-lett和top-right，bottom-left和bottom-right；2、box-shadow: 添加阴影 第一个参数是往右偏移: box-shadow:10px 0 0 0 red ； 第二个参数是往下...
最近在面试，不停地收到了知识冲击，尤其是对于一些基础的css、html、js问题居多，所以自我也在做反思，今天就css问题，如何让一个子元素div块元素上下左右居中 (以下总结方法，都已得到验证)。 情景一：一个浏览器页面中，只有一个div模块，让其上下左右居中 解决方案： { position:fixed; left:0; right:0; top:0; ...
最近业务需要，想设计一个比较通用的图文混排的列表。结果设计的过程中遇到了不少问题，虽然都是一些css设计中比较基础的问题，但是自己认为有必要总结下，希望可以帮到一些css设计的初学者，同时也想扩大下自己博客的知识量o(^_^)o。 1.最终设计的结果 HTML（部分，后面的li还有被省略了，当然外面的div也是应该关闭的，大家注意。）代码 复制代码代码如下:<div id="jingdian" class="span24 gmodule g-box"> <div class="g-box-...
1. ** { margin: 0; padding: 0; } 星号选择器用于选取页面中的所有元素，可用于快速清除所有元素的 margin 与 padding，但最好只在测试的时候使用，而不要正式用在 CSS 文件中，否则会大大加重浏览器负担。此外，星号选择器也可以给父层的所有子元素设定样式，重复一遍，尽量少用这种方式：#container * { border: 1px solid black; } 兼容 IE6+ 2. #X#container { width: 960px; margin: auto; } id 选择器，最常见的选...
本总结不断更新，主要记录本人调试过程中所终结的经验与方法。 毕竟本人不是做浏览器前端的，所以如有不详敬请见谅。 css关系到界面的美观，有时候功能实现了。界面确丑到没人用，终归还是一件失败的产品，所有好的产品不仅需要实用的功能，更加需要贴心美观的外观。 1.如果遇到整体布局工整，个别布局偏移的。 可以使用浏览器取道偏移的组件（放大镜），然后得到应用到这个组件的css文件中的css效果进行修改即可，如下图所示： 可...
CSS3中使用了很多的属性选择器，通过这些属性选择器，可以根据我们自己的设计来定义元素的样式，制作精美的网页。CSS3属性选择器下面是CSS3的属性选择器的语法，及使用。元素名字[元素类型=“类型名字”]：选择器名字{属性：值；属性：值； } 在元素类型匹配时，就可以使用类似正则的匹配方法。 [att=val] 指定特定名字的元素 [att*=val] 匹配val*的元素， [att^=val] 匹配val开头的元素，比如id为val1、val432432都可...