web前端开发技术实验报告 实验三(3)
发布时间：2021-06-05
web实验报告
3、制作页面结构
使用background-image背景属性插入图片。使用<h4>、<h6>标记和<p>标记分别设置标题和段落文本。用了<div>标签设置了一个盒子。用了<strong>标签加粗字体。还用了<span>标签，整体控制小盒子。
4、定义CSS样式
在css样式表中应用了width和height设置了盒子的大小，用了margin和padding设置了外边距和内边距。在css样式表中还对<span>标签中的设置了大小、字体、颜色以及背景。
五、实验代码及网页效果图
1．搭建基本结构
关键代码如下：
<body>
<div class="all">
<div class="one"><h4>正在播放《不完美小孩-TFBOYS》</h4></div> <div class="two">
<p>不完美小孩<br />演唱：TFBOYS<br />千：<br />当我的笑灿烂像阳光 <br />当我的梦做得更漂亮 <br />全世界在为我鼓掌 <br />只有你担心我受伤<br />源：<br /><strong class="big small">全世界在等我飞更高</strong> <br />你却在心疼我小小翅膀 <br />为我撑起沿途熟悉的地方 <br />凯：<br />当我必须像个完美的小孩 <br />满足所有的期待<br />你却好像格外欣赏 <br />我犯错犯傻的模样 <br />合： <br />我不完美的梦 <br /> 你陪着我想 <br />
</p>
</div>
<span></span>
<span><h6>不完美小孩</h6><p class="big four">横划可切换
</p></span>
<span></span>
<span></span>
<span></span>
</div></div>
</body>
效果如图3-1所示。
上一篇：广电银通电子密码锁方案
下一篇：第七章 会计职业道德教育与修养
