CSS笔记 - fgm练习 2-8 - 简易日历

【CSS笔记 - fgm练习 2-8 - 简易日历】的更多相关文章

CSS笔记 - fgm练习 2-8 - 简易日历

CSS笔记 - fgm练习 2-7 - 简易选项卡

练习地址 http://www.fgm.cc/learn/lesson2/07.html <style> body,ul,li{margin:0;padding:0;} body{font:12px/1.5 Tahoma;} #outer{width:450px;margin:10px auto;} #tab{overflow:hidden;zoom:1;background:#000;border:1px solid #000;} /* overflow:hidden;zoom:1; 作用?…

CSS笔记 - fgm练习 2-9 - 播放列表收缩展开

练习地址: http://www.fgm.cc/learn/lesson2/09.html <style> *{ margin: 0;padding: 0;font-size: 12px;list-style: none; } .outer{ width: 180px; margin: 10px auto; border: 1px solid #000; } .outer>h2{ padding: 5px; background: #ccc url(imgs/ico.gif) 160px…

CSS笔记 - fgm练习 2-10 - 提示框效果（清除子元素浮动高度塌陷的影响）

CSS清除浮动方法参考: https://blog.csdn.net/promiseCao/article/details/52771856 <style> *{ margin: 0; padding: 0; list-style: none; font-size: 12px; } .outer{ width: 560px; margin: 10px auto; border: 1px solid #000; padding: 10px 0 0 10px; } .outer>h2{ te…

CSS笔记 - fgm练习 - 鼠标移入移出div显示隐藏 CSS样式部分

问题总结: 1. checkbox和下面隐藏的div对齐,是在清除了默认样式的前提下,而不需要额外设置float: left; 2. 隐藏的div这里不需要专门设置宽高.居中,是靠内容和padding撑起来的尺寸.外层div居中,内层跟着居中. <style> *{margin:0;padding:0;} // 后来添加的 body{ font-size: 12px; } #outer{ margin: 10px auto; width: 180px; } /* #login input, #…

CSS笔记 - fgm练习 - 三个div变色 - CSS div等分布局

<title>三个div变红</title> <style> *{margin: 0; padding: 0} body{ text-align: center; } #outer{ width: 330px; display: flex; margin: 0 auto; } #outer div{ height: 100px; background-color: black; flex:1; margin: 5px; /* 平分3个div的方法,实例答案如下: #ou…

js基础练习二之简易日历

今天学到了js基础教程3,昨天的课后练习还没来的及做,这个是类似简易日历的小案例,视频还没听完,今晚继续...... 先看效果图: 其实做过前面的Tab选项卡,这个就很好理解了,通过鼠标放在不同月份月份上面进而改变当前月的背景颜色,并在下面的div中显示这个月的相应信息. 新增js知识:数组,innerHTML js代码: <script type="text/javascript"> var arr= ['一月,新年伊始,該做點什麽呢....','二月,春天來了....'…

javascript中Date对象的应用——简易日历的实现

× 目录 [1]效果 [2]HTML [3]CSS[4]JS 前面的话简易日历作为javascript中Date对象的常见应用,用途较广泛.本文将详细说明简易日历的实现思路效果演示 HTML说明使用type=number的两个input分别作为年和月的输入控件,这样在高级浏览器下自带调节按钮按照周日到周一的顺序进行星期的排列 <div class="box"> <header class='control'> <input id="con…

js简易日历

js简易日历中设计的知识点:选项卡切换数组 innerHTML 连接符与选项卡的区别:div的个数不同连接符中需要注意的:(优先级) "abc"+12+3+"def" 结果:abc123def "abc"+(12+3)+"def" 结果:abc15def html代码: <body> <div class="contain"…

利用JavaScript制作简易日历

<html xmlns="http://www.w3.org/1999/xhtml" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>简易日历的实现</title> <!--<link rel="style…