CSS 介绍

简介: CSS介绍

原文链接:https://note.noxussj.top/part1/css3/css.html?source=aliyun

什么是 CSS?

CSS 指层叠样式表 (Cascading Style Sheets),理解为 CSS 样式就可以了。CSS 样式有什么作用呢?比如我们在页面中添加了一个 div ,我想给这个 div 设置宽度、高度、背景色、阴影、内容字体样式等等,就是通过 CSS 样式来实现。也就是丰富 HTML 标签的样式。

现实生活举例,body 里面的所有标签就像是不同的一个人,每个人的特征都不同。style 里面定义的每一个 .xxx 样式,就代表买了一件衣服。这个衣服你可以给任何一个人穿,也就是可以给任何一个标签使用。这个标签穿了衣服就会变得更好看。一个人可以穿多件衣服,也可以多个人穿同一件衣服。


CSS 结构

<html>    <head>        <title>我是网站标题</title>        <style>            .my-content {
                font-size: 30px;
                color: red;
            }
        </style>    </head>    <body>        <divclass="my-content">我是一个人,我穿了一件红色衣服(my-content)</div>    </body></html>

在演练场中操作一下


CSS 语法

语法规则:选择器 + 类名 + 样式体

例如:.my-content {}

解析:. 代表类选择器、 my-content 代表类名、{} 样式写在里面


颜色模式

CSS 中定义颜色使用十六进制( hex )表示法为红,绿,蓝的颜色值结合。可以是最低值是 0 ( 十六进制 00 )到最高值是 255 ( 十六进制 FF )。

模式名称 写法 简写
十六进制 HEX #aabbcc #abc
RGB rgb(170, 187, 204)
RGBA rgba(170, 187, 204, 0.5)


相关文章
|
5月前
|
前端开发 开发者
css怎么学
【4月更文挑战第11天】css怎么学
28 1
|
前端开发
|
4月前
|
前端开发 JavaScript
CSS
【6月更文挑战第25天】CSS。
27 0
|
5月前
|
XML 前端开发 数据格式
初识CSS
CSS(Cascading Style Sheets)是一种用于给结构化文档(如HTML或XML)添加样式(如字体、间距和颜色)的编程语言。它通过使用选择器来指定样式,例如ID选择器 (#id)、类选择器 (.class) 和标签选择器 (element)。样式可以写在外部CSS文件中,然后在文档中引用,或者直接内联于HTML元素。当需要应用多个样式时,可以使用优先级来决定哪些样式生效。CSS还支持设置字体、浮动布局、内边距和外边距等属性,以及实现文本和元素的居中对齐。通过组合这些特性,开发者可以创建出复杂的网页布局和视觉效果。
|
11月前
纯CSS3实现一个丝带效果
纯CSS3实现一个丝带效果
98 0
|
前端开发 JavaScript 容器
css知识总结
css知识总结
141 0
css知识总结
|
Web App开发 前端开发
常用 CSS(上)
常用 CSS(上)
118 0
常用 CSS(上)
|
前端开发 JavaScript
|
前端开发
18. css
18. css
96 0
18. css
|
前端开发