css相关基础知识

最新推荐文章于 2022-11-30 21:37:28 发布

Kevin&Swift

最新推荐文章于 2022-11-30 21:37:28 发布

阅读量119

点赞数

分类专栏： css相关

本文链接：https://blog.csdn.net/qq_31214097/article/details/84837205

版权

9 篇文章 0 订阅

订阅专栏

css指的是层叠样式表样式的定义html如何进行显示.

样式通常存储在样式表中,解决内容与表现分离的问题.

css语法

由选择器属性和属性值三部分构成.

p
{
color:red;
text-align:center;
}

css中的注释位/*ccc*/ html中的注释位

css中有id选择器和class选择器

#para1 { text-align:center; color:red; }

id为单个元素的 class可以有多个元素的.

.center {text-align:center;}

也可以所有的p元素使用class = center

p.center {text-align:center;}

重点插入样式表有3中形式

外部样式表内部样式表和内联样式

外部样式表通过link标签链接到样式表中 <link>标签必须在文档的head中

<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

内部样式表通过在head中包含style标签来进行显示

<head>
<style>
hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}
</style>
</head>

内联样式仅在该元素上使用一次时,可用该方法.

<p style="color:sienna;margin-left:20px">这是一个段落。</p>

一般情况下加载优先级如下

内联样式 > 内部样式 > 外部样式 >浏览器默认样式

注意:如果外部样式放在内部样式的后面,则外部样式会覆盖内部样式.

文本的对齐方式,可以用text-align 进行实现 text-align:center;left;right;

文本修饰可用text-decoration 来实现

h1 {text-decoration:overline;}

文本转换将所有句子变成大写或小写字母,或首字母大写.

p.uppercase {text-transform:uppercase;} p.lowercase {text-transform:lowercase;} p.capitalize {text-transform:capitalize;}

文本缩进:可用text-indent:10px来实现.

优先级: 标签权重 1 如h1 类权重 10 如class id权重 100 如id 内联样式最高为1000 如style=

style中修改样式使用font-size = "" 这种风格在js中修改样式采用驼峰式风格,a.fontSize = 10px

关注