CSS介绍

2024-01-17 11:10 小编

CSS(Cascading Style Sheets) ，层叠样式表（级联样式表），用于设置HTML页面中的文本内容的字体、大小、对齐方式等，图片的宽高、边框样式、边距等以及页面的布局排版等各种外观显示样式。

CSS以HTML为基础，可以针对不同的浏览器设置不同的样式。CSS的出现可以说拯救了我们的页面，让HTML 专注去做结构呈现，而样式全部交给 CSS来美化。

我们在写HTML时，需要遵从一定的规范。CSS也有一定的语法规范，要想熟练地使用CSS对页面进行修饰，首先需要了解CSS样式规则，具体格式如下：

CSS语法由两部分组成：选择器和声明。声明包括：属性和属性值选择符 {属性: 属性值 ; 属性:属性值}

CSS入门宝典

规则：

/* 需要注释的内容 */

p { color: red; /* 所有段落标签字体颜色是红色*/}

CSS放到什么位置呢？怎么让它跟我们的HTML文件关联起来呢？

内联样式，又称行内样式、行间样式、内嵌样式。是通过标签的style属性来设置元素的样式。

内嵌式是将CSS代码集中写在HTML文档的head头部标签中，并且用style标签定义

<head> <style type="text/CSS"> 选择器 {属性1:属性值1; 属性2:属性值2; 属性3:属性值3;} p{ color:#000;font-size:14px;} </style></head>

当我们页面比较复杂，大量的内部样式，会导致页面看上去不美观，而且不利于维护。这时我们通常将所有的样式放在一个或多个以 ==.CSS== 为扩展名的外部样式表文件中，通过link标签将外部样式表文件链接到HTML文档中。

CSS入门宝典

网页中的标签很多，为了更好的完成我们的网页布局，我们需要在不同地方会放不同类型的标签。

根据标签在网页中的显示模式，可以将HTML标签一般分为块级标签和行内标签两种类型，即块元素和行内元素。

通过设置display的值，改变元素的显示模式。

1.行内转块：display:block;

2.块转行内：display:inline;

3.块、行内元素转换为行内块： display: inline-block;

4.none 此元素不会被显示

Tag：介绍

联络方式：

微信二维码

您感兴趣的内容