前端学习2——自学习梳理
1.HTML如何和CSS、JS关联呢
2.CSS语法(Css最重要的是：选择器和布局)
1. index2.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<!-- 外部样式 -->
<link rel="stylesheet" href="css/index2.css">
<!-- 内部样式 -->
<!-- <style>
div{
color:red;
background-color: aquamarine;
font-size: 30px;
}
</style> -->
</head>
<body>
<!-- 行内样式>内部样式=外部样式 -->
<!-- 行内样式 -->
<!-- <div style="color:red;background-color: aquamarine;font-size: 30px;">hello</div> -->
<div class="aaa">hello</div>
<div>hello</div>
<div>hello</div>
<div>hello</div>
<p class="aaa">demo</p>
<p>demo</p>
<p>demo</p>
<span class="aaa">hello</span>
<span>demo666</span>
<div>
<p>demo</p>
<h2>
<p>demo</p>
</h2>
</div>
<p>demo</p>
</body>
</html>2. index.css
/* div{
color:red;
background-color: aquamarine;
font-size: 30px;
} */
/* css语法 */
/* 选择器 {
属性: 值;
属性1: 值1;
} */
/* 选择器 */
/* 1、元素选择器 用元素名称做选择*/
/* div {
color: red;
background: gray;
font-size: 30px;
} */
/* 2、 id选择器 根据元素的id值做选择*/
/* #test {
color: red;
background: gray;
font-size: 30px;
} */
/* 3、class选择器 根据元素的class值做选择 */
/* .aaa{
color:red;
background-color: aquamarine;
font-size: 30px;
} */
/* 特例：结合选择器 */
/* span.aaa {
color: red;
background: gray;
font-size: 30px;
} */
/* 4、包含选择器 selector1 selector2{} 强调包含*/
/* div p {
color: red;
background: gray;
font-size: 30px;
} */
/* 5、子选择器 selector1>selector2{}强调父子 */
/* div>p {
color: red;
background: gray;
font-size: 30px;
} */
/* 6、选择器组合 selector1,selector2..{}*/
/* div,
span,
p {
color: red;
background: gray;
font-size: 30px;
} */
/* 选择全部 * */
/*
* {
color: red;
background: gray;
font-size: 30px;
}
*/
/* 布局 */原文地址：https://blog.csdn.net/qq_63125992/article/details/140671648
免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！