课程导航
Web前端开发 | 客观题 | 编程题 |
---|---|---|
概论 | 单元测试1 | |
HTML基础 | 单元测试2 | 单元作业1 |
CSS样式 | 单元测试3 | 单元作业2 |
CSS布局与定位 | 单元测试4 | 单元作业3 |
CSS3 | 单元测试5 | |
JavaScript基础 | 单元测试6 | 单元作业4 |
JQuery & HTML5 & Bootstrap | 单元测试7 | |
期末考试 | 客观选择题 | 这个还是自己写吧 |
题目
将网页文件完成后,将.html文件上传。CSS样式采用内嵌样式完成。
浮动定位实现如下内容(见附件 最终效果图):
-
有外层容器盒子,居中,宽度为页面的70%宽。(2分)
-
内层盒子宽度相等,灰色背景。(2分)
-
2个内层盒子分为2列,两个盒子之间有15px空隙。(2分)
-
每列均有h2标题和一个段落构成(内容不限)。(4分)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style type="text/css"> * { padding: 0; margin: 0; } .outer-box { display: flex; flex-flow: row nowrap; width: 70%; height: 100%; margin: 0 auto; } .inner-box { background-color: rgb(240, 240, 240); margin: 15px; } </style>
</head>
<body>
<div class="outer-box">
<div id="inner-box1" class="inner-box">
<h2>HTML</h2>
<p>
超文本标记语言(Hyper Text Markup
Language),标准通用标记语言的下一个应用。HTML不是一种编程语言,而是一种标记语言(markup
language),是网页制作所必备的 “超文本” 就是指页面内可以包含图片、链接,甚至音乐、程序等非文字元素。超文本标记语言的结构包括
“头” 部分(英语:Head)、和 “主体” 部分(英语:Body)。其中 “头” 部提供关于网页的信息, “主体”
部分提供网页的具体内容。
</p>
</div>
<div id="inner-box2" class="inner-box">
<h2>CSS</h2>
<p>
层叠样式表(英文全称:Cascading Style
Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)
等文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。CSS能够对网页中元素位置的排版进行像素级精确控制,
支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力。
</p>
</div>
</div>
</body>
</html>