CSS层叠样式表 基础知识

演示链接

http://xuanransoftware.com/phpStudy/0405/

学习总结

• css就是加在html文档上的样式文件，让网页看起来更加的美观

• 可以给单个网页加载样式文件，也可以用一个样式文件给多个网页加载样式

  效果图

  

• css示例代码

body {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  align-items: center;
}
form {
  padding: 20px;
  box-shadow: 0 0 8px #888;
  border-radius: 10px;
  margin: auto;
  background-color: lightskyblue;
  display: grid;
  gap: 15px;
}
form fieldset {
  align-items: center;
}
h2 {
  color: forestgreen;
}
.nav {
  font-size: large;
  font-weight: bold;
  align-items: center;
  display: flex;
  height: 50px;
  background-color: white;
}
.nav ul {
  display: flex;
  list-style: none;
}
.nav ul a {
  color: blue;
  text-decoration: none;
  padding: 0 15px;
}
button {
  height: 30px;
  width: 100;
  border: none;
  outline: none;
  background-color: lightseagreen;
  color: white;
}
button:hover {
  background-color: lightsalmon;
  cursor: pointer;
}
#asideH {
  font-size: large;
  font-weight: bold;
  font-family: Verdana, Geneva, Tahoma, sans-serif;
  color: yellowgreen;
}
.asideC {
  font-size: small;
}