CSS简单样式练习（三）

运行效果: 源代码: 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>菜单</title> 6 <style type="text/css"> 7 *{ 8 margin: 0; 9 padding: 0; 10 border: none; 11 } 1…

入职已经一个月了,自此后,就好久没有写过博客了,在此先跟关注我的博友们说声抱歉.今天,在公司的一个培训作业的驱动以及伟哥那句“再不写博客就开除你”的监督下,我终于重拾旧爱,再次登录博客园,继续与大家分享我的学习成果. 好了,直入主题,大家都知道,CSS的中文名叫做层叠样式表,而CSS在控制样式的时候,有三种引入方式,分别是: 1>外部样式表 : 将样式规则直接写在*.css文件中,然后再*.html页面中通过<link>标签引入的方式 2>内部样式表 :(位于 <head&g…

CSS常用样式（三）

一.2D变换 1.transform 设置或检索对象的转换取值: none::以一个含六值的(a,b,c,d,e,f)变换矩阵的形式指定一个2D变换,相当于直接应用一个[a,b,c,d,e,f]变换矩阵 translate(<length>[, <length>]).第一个参数对应X轴,第二个参数对应Y轴.如果第二个参数未提供,则默认值为0. translateX(<length>):指定对象X轴(水平方向)的平移 translateY(<length>…

CSS简单样式练习（七）

运行效果: 源代码: 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>学习使用CSS</title> 6 <style type="text/css"> 7 p{ 8 font-family: "宋体"; 9 text-align:…

CSS简单样式练习（六）

运行效果: 源代码: 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Sina</title> 6 <style type="text/css"> 7 *{ 8 margin: 0; 9 padding: 0; 10 border: none; 11 }…

CSS简单样式练习（五）

运行效果: 源代码: 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>春天</title> 6 <style type="text/css"> 7 8 *{ 9 margin: 0; 10 padding: 0; 11 border: none; 12…

CSS简单样式练习（四）

运行效果: 源代码: 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Google</title> 6 <style type="text/css"> 7 8 body{ 9 font-family: "宋体"; 10 } 11 12…

CSS简单样式练习（二）

运行效果: 源代码: 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>传智播客</title> 6 <style type="text/css"> 7 * { 8 margin: 0; 9 padding: 0; 10 border: none; 11…

CSS简单样式练习（一）

运行效果: 源代码: 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>城东早春</title> 6 <style type="text/css"> 7 *{ 8 margin: 0; 9 padding: 0; 10 border: none; 11 }…

CSS常用样式（四）之animation

上篇CSS常用样式(三)这篇博文中已经介绍过了CSS中具有动画效果的transition.transform,今天来大概说说CSS中的animation.animation的加入会使得动画效果更加乐观. animation animation的实现需要通过keyframes来实现.keyframes(关键帧),类似于flash当中的关键帧.关键帧有其自己的语法规则,他的命名是由"@keyframes"开头,后面紧接着是这个“动画的名称”加上一对花括号“{}”,括号中就是一些不同时间段样…