批改状态:合格
老师批语:
01内联框架标签工作原理
- target= name(
a herf标签的target属性等于iframe标签的name属性发生交互)
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>内联框架标签工作原理</title><style>iframe {width: 30em;height: 16em;}</style></head><body><a href="https://j.map.baidu.com/86/VpE", target="yangj">阳江地图</a><iframe src="" name = "yangj"></iframe></body></html>
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>内联框架标签工作原理</title><style>iframe {width: 30em;height: 16em;}div {display: grid;}</style></head><body><!-- 标题 --><div class="header">网站管理后台</div><!-- 侧边栏 --><a href="https://docs.qq.com/desktop/mydoc/folder/1IYzC_100000" target="content">实务</a><a href="https://docs.qq.com/desktop/mydoc/folder/1IYzC_100000" target="content">体验馆</a><div><div class='mian'></div><iframe srcdoc="请点击右侧按钮" name="content"></iframe></div></body></html>
术语:
选择器、规则、属性和值,声明块
选择器:h1,id,class,style等
声明块:{、、、}
属性和值:键值对,color:blue
规则:选择器+声明块
外部写法:<link rel="stylesheet" href="001.css">推荐多使用,养成习惯
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title></head><style>h1 {color: #007aff;font-weight: 200;}</style><body><header class="page-header"></header><h1 id="page-title" class="title">web</h1></body></html>
css优先级与基础语法
01优先级
1.标签选择器(h1)
2.属性选择器(class、id)
3.id>class>tag
02基础语法
1.css中的class写可以#,id可以写成.
2.*代表所有
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title></head><style>h1 {color: #007aff;}.title {color: #ff1700;}#page-title {color: #cb954f;}</style><body><h1 id="page-title" class="title">哈哈</h1></body></html>
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号