<iframe>标签的使用：
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>iframe标签的使用</title> </head> <body> <div style="float: left; margin-right:10px"> <ul> <li><a href="https://www.163.com" target="main">网易</a></li> <li><a href="https://www.sina.com" target="main">新浪</a></li> <li><a href="https://www.baidu.com" target="main">百度</a></li> <li><a href="https://www.jd.com" target="main">京东</a></li> </ul> </div> <iframe src="https://www.taobao.com" frameborder="0" name="main" width="400" height="600" style="float: left"></iframe> </body> </html>
点击 "运行实例" 按钮查看在线实例
css样式设置的优先级：
收藏
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>css样式设置的优先级</title>
<link rel="stylesheet" href="style1.css">
<style>
p {
color: darkorchid
}
</style>
</head>
<body>
<p>我爱学习 学习使我快乐</p>
<p>我爱学习 学习使我快乐</p>
<p style="color: darkorange">我爱学习 学习使我快乐</p>
</body>
</html>点击 "运行实例" 按钮查看在线实例
css的id, class与标签选择器的使用规则
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>css的id, class与标签选择器的使用规则</title>
<style>
#aa {
color: #f00
}
.yy {
color: darkturquoise
}
p {
color: goldenrod
}
</style>
</head>
<body>
<p id="aa" class="yy">阿萨德噶数据库老大哥</p>
</body>
</html>点击 "运行实例" 按钮查看在线实例
盒模型的五大要素
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>盒模型的五大要素</title>
<style>
.box1 {
background-color: goldenrod;
border: 2px saddlebrown solid;
width: 300px;
height: 500px;
}
.box2 {
background-color: skyblue;
margin: 50px 20px;
padding: 10px 20px 30px 40px;
border: 2px dashed #f00;
}
</style>
</head>
<body>
<div class="box1">
<div class="box2">php中文网原创视频：《天龙八部》公益php培训系列课程汇总！ php中文网《玉女心经》公益***系列课程汇总 令人期待的PHP7.4 正则表达式语法教程（含在线测试工具） 韩天峰：关于PHP程序员技术职业生涯规划 四个优秀php原生开发实战视频教程推荐（必学） PHPConChina 2019 参会感悟</div>
</div>
</body>
</html>点击 "运行实例" 按钮查看在线实例
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
