南大软院二十一天成神计划

原创 2015年11月20日 21:50:10

今天学的是HTML+CSS基础课程,因为章节比较多,用了一天多的时间来学习,依旧有些是新知识,有些是旧知识,在复习中掺杂着学习。

印象较为深刻的是页面布局,个人觉得自适应是一个很好的工具,使用自适应可以避免内容溢出,但是同时又有风险,要想使用,就一定要控制的住,否则会乱七八糟。下面贴一点自己写的关于布局的代码:<style type="text/css">
body{font-size:24px;
font-family:"新宋体";
background-color:#FF6666;
}
#wrap{
margin:0 auto;
width:900px;}
#header{
height:60px;
background:#0099FF}
#container{
background-color:#FF33FF;
}
#mainbox{
float:left;
width:200px;
background:yellow;
}
#submainBox{
float:left;
width:200px;
background:red;
margin:5px;
}
#sideBox{
float:left;
width:200px;
background:blue;
margin:5px;
}
#footer{
clear:both;
height:60px;
background:green}
</style>
<body>
<div id="wrap">
  <div id="header">头部</div>
   <div id="container">
    <div id="mainbox">
     <p>左边内容</p>
     <p>左边内容</p>
     <p>左边内容</p>
     <p>左边内容</p>
     <p>左边内容</p>
     <p>左边内容</p>
    </div>
      <div id="sideBox">
       <p>中间内容</p>
       <p>中间内容</p>
       <p>中间内容</p>
       <p>中间内容</p>
       <p>中间内容</p>
       <p>中间内容</p>
      </div>
    <div id="submainBox">
        <p>右边内容</p>
        <p>右边内容</p>
        <p>右边内容</p>
        <p>右边内容</p>
        <p>右边内容</p>
        <p>右边内容</p>
       </div>
    </div>
<div id="footer">尾部</div>
</div>
</body>

另外,关于盒模型,对于宽度的理解,是内容的宽度width+填充padding(内边距)+边框宽度border+外边距margin。


也了解了关于层模型定位的区别position:

1、绝对定位(position: absolute)

2、相对定位(position: relative)

3、固定定位(position: fixed)

还了解到另外一种长度值“em”,同“px”一样,也是相对长度,还知道原来颜色也是有值的,涨姿势了~

今天的收获很多,明天周末,多学点,fighting!!!



西南大学网络与继续教育学院课程考试试题卷

西南大学网络与继续教育学院课程考试试题卷   类别: 网教   专业: 计算机科学与技术、计算机教育 2013年 12月 课程名称【编号】:  多媒体技术  【 0165】          T...
  • jaray
  • jaray
  • 2013年11月26日 09:14
  • 13294

大神的ACM训练计划(详细)

看完人家的博客,发现任重道远。。。 一位高手对我的建议: 一般要做到50行以内的程序不用调试、100行以内的二分钟内调试成功.acm主要是考算法的 ,主要时间是花在思考算法上,不是花在写...
  • victordiao
  • victordiao
  • 2016年07月21日 11:36
  • 3970

dw与sublime的区别 --南大软院大神养成计划

学习第一天,学习了dw与sublime,dw是一个可视化的web编辑器。而sublime是一个类似记事本的编辑器。dw的优点就是傻瓜式编程。操作dw就跟操作word等一样。不用牢记代码。并且即操作即可...
  • u013175229
  • u013175229
  • 2015年11月16日 21:47
  • 1060

南大软院二十一天成神计划

网页简单布局之结构与表现原则,老师一直强调两者要相互分离,不要让一个去适应另外一个,要能独立存在。老师运用三个小例子来做讲解,分别是微博用户发言信息,电话号码布局以及排行榜。 分别从初学者的思想、中级...
  • snowing1022
  • snowing1022
  • 2015年11月24日 21:42
  • 270

南大软院二十一天成神计划

今天学的不多,所以借这次机会复习了一下表单,在昨天的导航栏的基础上增加了一点简单的内容,当做练习巩固。 body{ background-color:#33FFCC} #box{ backgroun...
  • snowing1022
  • snowing1022
  • 2015年11月26日 22:29
  • 303

南大软院二十一天成神计划

我们需要学习JavaScript,因为它能给我们带来更好的用户体验: 1.增强页面动态效果(如:下拉菜单、图片轮播、信息滚动等) 2.实现页面与用户之间的实时、动态交互(如:用户注...
  • snowing1022
  • snowing1022
  • 2015年11月29日 23:13
  • 182

南大软院大神养成计划——第一天学习心得

今天是南大软院大神养成计划开始的第一天,在参加这次活动之前,我犹豫了很久到底要不要参加此次计划,因为我对成为一名web前端开发不是很感兴趣,我更感兴趣的是嵌入式开发,但是后面经过室友的鼓励,我还是选择...
  • qq_23418043
  • qq_23418043
  • 2015年11月16日 22:32
  • 412

南大软院大神养成计划-Web前端入门学习归纳第二天-认识前端开发工具Dreamweaver(2)

接上篇 五、智能提示功能 DW对各种不同的语言文件的各种标签、CSS文件的各种属性、编写代码时的各种操作、JAVAscript语言中的函数关键字等都有提示,对语法错误也会立即在行号上有提示,这些对...
  • zhouhanyuxi
  • zhouhanyuxi
  • 2015年11月17日 23:57
  • 336

南大软院大神养成计划实施——第八天

今天是南大软院大神养成计划实施第八天。又是一个星期的开始,今天学习的内容主要是DOM探索之基础详解篇的前3章,因为在上课外加其他事情,这部分的知识也是新知识,所以今天就没有学习完这部分的知识,只是学习...
  • qq_23418043
  • qq_23418043
  • 2015年11月23日 17:14
  • 372

南大软院大神养成计划——HTML和CSS基础课程(一)

学习小结   今天为学习的第三天,主要学了如何使用表单标签,与用户交互。表单作用:把浏览者输入的数据传送到服务器端,这样服务器端程序就可以处理表单传过来的数据。 语法: 讲解:1.标签是成对出现...
  • frosting_sky
  • frosting_sky
  • 2015年11月20日 21:25
  • 198
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:南大软院二十一天成神计划
举报原因:
原因补充:

(最多只允许输入30个字)