target,框架集,css3过渡动画,css3圆角-阴影-透明度,运动曲线,图片文字遮罩,变形

target

模拟后台服务器

框架集

frameset和body不合,所以如果用frameset就不能有body标签

利用框架可以把浏览器窗口划分为若干个区域,每个区域就是一个框架,在其中分别显

示不同的网页,同时还需要一个文件记录框架的数量、布局、链接和属性等信息,这个文件就是框架集。

框架集与框架之间的关系就是包含与被包含的关系,框架集中包含了top、left、main和bottom 4个框架。

<frameset cols="50%, 50%"> 将浏览器窗口分成两个(各50%)

css3过渡动画

transition 过渡,转变

transition: all 500ms ease (将所有过渡动画500毫秒播放,并且缓慢的播放)

.###hover{

width: 300px;

height: 300px;

background-color: skyblue;

border-radius: 60px;

鼠标滑过的时候改变状态,为高300宽300背景图像变为天蓝色并且将边框变为圆角边框

css3圆角,阴影,透明度

/*border-top-left-radius: 100px 50px;左上角为椭圆圆角*/

/*border-top-left-radius: 100px;

border-top-right-radius: 100px;左、右上角为正圆圆角*/

/*border-radius: 40px;曲率半径为40的圆角矩形*/

/*border-radius: 20%;最大200px,20%即40px*/


/*水平偏移 垂直偏移 羽化大小 扩展大小 颜色*/

box-shadow: 10px 10px 10px 0px #bfa;


/*水平偏移 垂直偏移 羽化大小 扩展大小 颜色 是否内阴影*/

box-shadow: 0px 0px 20px 2px red inset;


/*透明度30%,文字也透明了*/

opacity: 0.3;


/*背景色变透明,但文字不会透明*/

background-color: rgba(255,215,0,0.3);


/*边框透明*/

border: 2px solid rgba(0,0,0,0.3);

运动曲线

ease 开始和结束慢速

ease-in 开始是慢速

ease-out 结束时慢速

ease-in-out 开始和结束时慢速

@keyframes:定义关键帧动画

animation-name:动画名称

animation-duration:动画时间

 animation-timing-function:动画曲线

作者:王林1907

链接:https://www.jianshu.com/p/acb2aaec72b7

来源:简书

著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

图片文字遮罩

rgba:rgba(0,0,0,0.1)第四个为透明度

变行

.box:hover{

transform: translate(50px,50px);

}  平移过渡

.box2:hover{

transform: rotate(3600deg);

background-color: purple

}    旋转过渡

.box3:hover{

transform: scale(0.5,0.2);

}  缩放过渡

.box4:hover{

transform: skew(0, 45deg);

}  斜角过渡

  羽化大小不可为负        deg为度数单位        perspective一般值为800px        正值沿轴顺时针旋转;负值逆时针旋转 

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,772评论 6 477
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,458评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,610评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,640评论 1 276
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,657评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,590评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,962评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,631评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,870评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,611评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,704评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,386评论 4 319
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,969评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,944评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,179评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 44,742评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,440评论 2 342