收藏
批改状态：合格
老师批语：作业写得还行, 以后尽可能当天作业尽快完成, 这样突击写, 效果并不好,你说呢?
作业1：写一案例,要求用到<a href="" target="">与<iframe>理解target属性与name属性之间的关联是如何实现的。
作业2：写一个案例, 演示css中的内联样式,内部样式,外部样式的应用场景,理解style属性, style标签, 以及外部样式表的使用方式。
实例
<!DOCTYPE html>
<html lang="en">
实例
.waibu {
color : blueviolet ;
font-size: 50px;
}
.floatleft {
float: left;
}
运行实例 »
点击 "运行实例" 按钮查看在线实例
<head>
<meta charset="UTF-8">
<title>7月3日直播课作业</title>
<style>
.neibu{
color: coral;
text-align: right;
font-size: 60px;
}
</style>
<link rel="stylesheet" href="static/css/0703.css" />
</head>
<body>
<!--作业1：写一案例,要求用到<a href="" target="">与<iframe>理解target属性与name属性之间的关联是如何实现的-->
<p>作业1：写一案例,要求用到a标签与框架，理解target属性与name属性之间的关联是如何实现的</p>
<h2>网站列表</h2>
<ul style="float: left">
<li><a href="http://www.baidu.com/" target="win">百度</a></li>
<li><a href="http://www.qq.com/" target="win">腾讯</a></li>
<li><a href="http://www.sina.com.cn/" target="win">新浪</a></li>
<li><a href="http://www.sohu.com/" target="win">搜狐</a></li>
</ul>
<iframe srcdoc="<h3>网站列表</h3>" frameborder="0" width="80%" height="400" name="win" style="float: left"></iframe>
<!--
总结：
1、a标签集合iframe框架可用于网站后台建立，左边菜单、右边内容的模式。
2、a标签主要属性：
hrf：链接的地址，注意需要带http
target：窗口打开的方式。_blank：在新窗口中打开；_self：默认值，在自身窗口中打开；_parent：在父窗口中打开；_top：在整个窗口中打开被链接文档；
如果与iframe框架结合，命名一个名称，与iframe的name属性值相同时，即可在该命名的窗口中打开页面，实现菜单与内容显示的关联。
3、iframe标签主要属性：
src：外链地址，需要带http；
srcdoc：默认显示内容，使用html标签书写；
frameborder：边框大小，值为数字，0表示不显示边框；
width、height：框架宽高值，可以用px，也可以用百分比%；
-->
<!--语义化标签结构开始-->
<!--网页头部-->
<header>
<nav>导航</nav>
</header>
<!--网页主体-->
<main>
<!--主体内的文章内容部分-->
<article>
<!--标题-->
<h2>XXXX</h2>
<!--区块-->
<section>区块内容：段落、图片等</section>
</article>
</main>
<!--页脚部分-->
<footer>页脚</footer>
<!--语义化标签结构结束->
<!--作业2：写一个案例, 演示css中的内联样式,内部样式,外部样式的应用场景,理解style属性, style标签, 以及外部样式表的使用方式-->
<p>作业2：写一个案例, 演示css中的内联样式,内部样式,外部样式的应用场景,理解style属性, style标签, 以及外部样式表的使用方式</p>
<!-- 1、内联样式-->
<div>
<p>1、内联样式</p>
<p style="color: darkgreen;font-size: 30px">
***:巩固党和国家机构改革成果 推进国家治理体系和治理能力现代化
</p>
<p style="color:red;">
央视网消息：（新闻联播）深化党和国家机构改革总结会议5日在北京召开。
</p>
<p>2、内部样式</p>
<p class="neibu">
他强调，深化党和国家机构改革是对党和国家组织结构和管理体
</p>
<p>3、外部样式</p>
<p class="waibu">
我们整体性推进中央和地方各级各类机构改革，重构性健全党的领导体系
</p>
</div>
<!--作业3：对于盒 模型中的内外边距, 边框的样式设置有什么不同, 写出你的理解-->
<p>作业3：对于盒 模型中的内外边距, 边框的样式设置有什么不同, 写出你的理解</p>
<p>
答：盒模型包括4各部分从内到外分别为：内容、内边距、边框、外边距。内容及边框是不透明的，具有颜色、大小、宽度、类型等属性；内边距和外边距是透明的，不可见，只有宽度属性。
</p>
<p>
盒模型是web页面中最重要的概念，一切皆盒子，任何元素都可以看做是盒子，只需要按照盒子的排列和布局，即可设计出想要的页面布局。
</p>
<!--作业4：盒模型的每个要素的排列方式是什么?要求背下来-->
<p>作业4：盒模型的每个要素的排列方式是什么?</p>
<p>
答：盒模型的内边距、边框、外边距局可分为：上、右、下、左四个方向，从上开始，按照顺时针方向排列。
</p>
<P>
疑问：本次作业1使用浮动之后，不知道为什么，语义化标签部分并没有使用浮动的情况下也跟着浮动了，希望老师指导。
</P>
</body>
</html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
作业3：对于盒 模型中的内外边距, 边框的样式设置有什么不同, 写出你的理解。
答：盒模型包括4各部分从内到外分别为：内容、内边距、边框、外边距。内容及边框是不透明的，具有颜色、大小、宽度、类型等属性；内边距和外边距是透明的，不可见，只有宽度属性。盒模型是web页面中最重要的概念，一切皆盒子，任何元素都可以看做是盒子，只需要按照盒子的排列和布局，即可设计出想要的页面布局。
作业4：盒模型的每个要素的排列方式是什么?要求背下来。
答：盒模型的内边距、边框、外边距局可分为：上、右、下、左四个方向，从上开始，按照顺时针方向排列。
总结：
1、a标签集合iframe框架可用于网站后台建立，左边菜单、右边内容的模式。
2、a标签主要属性：
hrf：链接的地址，注意需要带http
target：窗口打开的方式。_blank：在新窗口中打开；_self：默认值，在自身窗口中打开；_parent：在父窗口中打开；_top：在整个窗口中打开被链接文档；
如果与iframe框架结合，命名一个名称，与iframe的name属性值相同时，即可在该命名的窗口中打开页面，实现菜单与内容显示的关联。
3、iframe标签主要属性：
src：外链地址，需要带http；
srcdoc：默认显示内容，使用html标签书写；
frameborder：边框大小，值为数字，0表示不显示边框；
width、height：框架宽高值，可以用px，也可以用百分比%；
疑问：本次作业1使用浮动之后，不知道为什么，语义化标签部分并没有使用浮动的情况下也跟着浮动了，希望老师指导。 
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
