关于CSS样式部分介绍

                                                                   CSS是什么?

css(层叠样式表),层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。

CSS 能够对网页中元素位置的排版进行像素级精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力。

                                                            添加CSS的三种方法

1、链接外部样式表

每个页面使用<link>标签链接到样式表。<link>标签在文档的头部<>head标签。具体代码如下:

<head>

<linkrel="stylesheet"type="text/css"href="mystyle">

</head>

说明:rel:表示使用外部样式表 type:表示文件的类型是样式表文件  href:表示文件所在位置

2.内部样式表

使用<style>标签在文档头部定义内部样式表。

<head>

<style>

hr {color:sienna;}

p {margin-left:20px;}

body {background-image:url(xxx);}

</style>

</head>

3.内嵌样式(慎用,会损失掉样式表的很多优势)

使用标签 的style属性,给标签添加样式。style属性可以包含任何CSS属性。

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

4.多重样式的优先级

内联样式inline style>(内部样式)internal style sheet>(外部样式External style sheet>浏览器默认样式。

关于CSS的基本语法

css的语法结构由3部分组成:选择符(selector),样式属性(property)和值(value)

格式:选择符(selector){样式属性:取值;样式属性:取值;...}

其中:属性和值成对出现,用冒号,多个属性用分号分开。

CSS选择器

选择器:用于选区HTML的标签,给其添加样式。



                                                                      CSS选择器

一、id选择器:

标有特定 id 的 HTML 标签指定特定的样式,id选择器以#开头。只能使用一次,不能结合使用。每个标签的id都是唯一的,不能相同。

#para1{

text-align:center;

color:red;

}

二、

类(class)选择器:

HTML标签的class属性用于规定HTML标签的类名。HTML5中,class属性可以用于所有标签,但是不一定都有用。类名的命名不能以数字开头,区分大小写。不同的标签的类名可以相同。

可以给 HTML 元素赋予多个 class,用空格分开。例如:。这么做可以把若干个 CSS 类合并到一个 HTML 元素。

类(class)选择器以"."显示。

实例:.center {text-align:center;}

三:属性选择器

属性选择器可以根据元素的属性及属性值来选择元素。即通过属性来选择对应的标签。

a[href] {color:red;}

四:子选择器

与后代选择器相比,子元素选择器(Child selectors)只能选择作为某元素子元素的元素。

子结合符两边可以有空白符,这是可选的。

h1>strong {color:red;}

五:伪类选择器(pseudo classes)

CSS 伪类用于向某些选择器添加特殊的效果。

语法

伪类的语法:

selector : pseudo-class {property: value}

CSS 类也可与伪类搭配使用。

selector.class : pseudo-class {property: value}

好了,今天就介绍到这,下次再进行补充~~~~

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,813评论 1 92
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,748评论 1 45
  • 学会使用CSS选择器熟记CSS样式和外观属性熟练掌握CSS各种选择器熟练掌握CSS各种选择器熟练掌握CSS三种显示...
    七彩小鹿阅读 6,342评论 2 66
  • 不管你有什么愿望,只要把烦恼的信丢进铁卷门上的投递口,隔天就可以在店后面的牛奶箱里拿到回信解答。 ...
    wuli有甲YDS阅读 295评论 0 0
  • 夜风微凉云遮月,才下眉头,又上心头。对镜凝望,惆怅浮在脸上,心事藏在心里。饮一壶浊酒,跳一段惊鸿,唱一曲离人愁,却...
    踏雪无痕Sunny阅读 458评论 0 0