CSS 详解

Posted bushaoxun

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了CSS 详解相关的知识,希望对你有一定的参考价值。

CSS 简介

css是英文Cascading Style Sheets的缩写,称为层叠样式表,用于对页面进行美化。

存在方式有三种:元素内联、页面嵌入和外部引入,比较三种方式的优缺点。

语法:style = ‘key1:value1;key2:value2;‘

  • 在标签中使用 style=‘xx:xxx;‘
  • 在页面中嵌入 < style type="text/css"> </style > 块
  • 引入外部css文件

CSS选择器

标签选择器

div{ background-color:red; }
<div > </div>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>战神</title>
    <style>
        div {
            background-color: aquamarine;
            border:1px solid red;
            width: 900px;
            height:1000px;
            margin: 0 auto
        }
    </style>
</head>
<body>
  <div>
  </div>
</body>
</html>

 

class选择器

.bd{ background-color:red; }
<div class=‘bd‘> </div>

id选择器

#idselect{ background-color:red; }
<div id=‘idselect‘ > </div>

关联选择器

#idselect p{ background-color:red; }
<div id=‘idselect‘ > <p> </p> </div>

组合选择器

input,div,p{ background-color:red; }

属性选择器

input[type=‘text‘]{ width:100px; height:200px; }

 






以上是关于CSS 详解的主要内容,如果未能解决你的问题,请参考以下文章

VSCode自定义代码片段7——CSS动画

VSCode自定义代码片段7——CSS动画

VSCode自定义代码片段6——CSS选择器

css常用代码片段 (更新中)

CSS代码片段

CSS代码片段