CSS(1)

最新推荐文章于 2024-09-14 17:04:32 发布

果汁药

最新推荐文章于 2024-09-14 17:04:32 发布

阅读量318

点赞数 9

文章标签： css 前端

本文链接：https://blog.csdn.net/weixin_67556036/article/details/135492639

版权

本文详细介绍了CSS的基础知识，包括元素、id、类选择器，以及字体、文本属性的设置方法。同时讲解了内部和外部样式表的引入方式。

摘要由CSDN通过智能技术生成

CSS（1）

语法规范

<style>
     p{
         color:cadetblue;
         font-size: 7px;
     }
</style>
<p>少小离127-667-917家老大回</p>

1. css基础选择器

1.1 元素选择器

作用：根据标签名来选中指定的元素

语法：标签名{}

例子：p{} h1{}

1.2用id选择器

作用：根据元素的id属性值选中元素

语法：#id属性值{}(不要重复使用)

例子：#box{} #red{}

1.3类选择器

作用：根据元素的class属性值选中一组元素

语法：.class属性值

1.4通配选择器

作用：选中页面中的所有元素

语法：*

2.css字体属性

2.1使用font-family属性定义文本的字体系列

h1{
    font-family: "微软雅黑";
}

2.2使用font-size属性定义文本的字体大小

h1{
    font-size: 20px;
}

2.3使用font-weight属性定义文本的字体粗细

bold、700 字体加粗

normal、400 不加粗

2.4使用font-style属性定义文本的风格(是不是斜体)

normal 默认

italic 斜体

2.5字体复合属性

h1{
    font: font-style font-weight font-size/line-height font-family;
}

3.css文本属性

3.1color属性用于定义文本颜色

div{
    color:red;
}

3.2text-align属性用于设置元素内文本内容的水平对齐方式

div{
    text-align: center/right/left;
}

3.3line-height属性用于设置行间距离，控制文字行与行之间的距离

div{
    line-height: 10px;
}

4.css引入方式

4.1内部样式表

4.1外部样式表

单独写一个css文件，然后把css文件引入HTML页面中

步骤：

新建一个后缀名为.css的样式文件，把css的代码放在里面
在HTML页面中，使用<link>标签引入这个文件

<link rel="stylesheet" href="css文件路径">

果汁药

关注

9
点赞
踩
9

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫