收藏
批改状态：合格
老师批语：padding是撑大盒子, margin会向父元素传递, 这都是要非常小心的
<iframe>标签示例：
源码：
<h1>网站管理后台</h1> <ul style="float:left;"> <li><a href="demo3.html" target="main">用户管理</a></li> <li><a href="demo4.html" target="main">商品管理</a></li> <li><a href="demo6.html" target="main">分类管理</a></li> <li><a href="demo5.html" target="main">系统管理</a></li> </ul> <iframe srcdoc="<h2>显示页面</h2>" frameborder="" width="400" height="400" name="main" style="float:left;"></iframe>
css样式优先级：
内联式 与 内部样式表的比较
源码：
<style>
p {
color: red;
}
</style>
</head>
<p style="color: blue">林志玲嫁给了一个***人</p>
<p>苍太难</p>
<p>波波</p>内部样式表与外部样式表
源码：
<link rel="stylesheet" href="static/css/style1.css">
<style>
p {
color: red;
}
</style>
</head>
<p style="color: blue">林志玲嫁给了一个***人</p>
<p>苍太难</p>
<p>波波</p>
</body>css代码：
p {
color: green;
}css id class 标签选择器使用规则：
源码：
<style>
#macbook {
color: red;
}
.green {
color: green;
}
p {
color: blue;
}
</style>
<body>
<p id="macbook">买了mac的同学，后悔了吗</p>
<p class="green" id="macbook">买了mac的同学</p>
<p class="green">后悔了吗</p>盒模型五大元素：
源码：
<div class="box1"> <div class="box2"></div> </div>
.box1 {
width: 200px;
height: 200px;
background-color: lightblue;
padding: 20px 30px 40px 50px;
border-top: 10px green dashed;
border-right: 10px solid red;
border-bottom: 12px yellow double;
border-left: 10px saddlebrown dotted;
}
.box2 {
width: inherit;
height: inherit;
background-color: wheat;
}总结：
今天课程主要学习了内联框架<iframe>,framborder 可以显示iframe标签的边框，可以将iframe的那么值放入a标签的target中实现在内联框中连接。通用容器：div 和span。
css（层级样式表）：
在引入css时，内联样式表（style=“”）的优先级大于内部样式表（style标签）大于外部样式表（link）。css选择器优先级：js 》id 》class》标签。在盒子模型中 ，padding margin 时透明的不能设置样式，颜色。padding和margin的书写顺序都是顺时针方向。border的颜色 样式 宽度 顺序可以随意。子级在继承父级的时候可以不用继承宽度，而padding和margin不能使用继承，否则padding会产生增大效果，而margin会向父级元素传递。
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
