欢迎来到模板无忧!织梦模板,dede模板下载,织梦cms模板,免费网站模板下载站

模板无忧

CSS 基础知识

企业模板

  选择符:又称选择器,指明网页中要应用样式规则的元素,如本例中是网页中所有些段(p)的文字将变成蓝色,而其他的元素(如ol)不会遭到影响。

  声明:在英文大括号“{}”中的的就是声明,属性和值之间用英文冒号“:”分隔。当有多条声明时,中间可以英文分号“;”分隔。

  从CSS样式代码插入的形式来看基本可以分为以下3种:内联式、嵌入式和外部式三种。

  内联式css样式表就是把css代码直接写在现有些HTML标签中。

  嵌入式css样式,就是可以把css样式代码写在<styletype="text/css"></style>标签之间。

  外部式css样式(也可称为外联式)就是把css代码写一个单独的外部文件中,这个css样式文件以“.css”为扩展名,在<head>内(不是在<style>标签内)用<link>标签将css样式文件链接到HTML文件内,eg:<linkhref="style.css"rel="stylesheet"type="text/css"/>

  优先级:内联式>嵌入式>外部式

  但嵌入式>外部式有一个首要条件:嵌入式css样式的地方肯定在外部式的后面。即<linkhref="style.css"...>代码在<styletype="text/css">...</style>代码的前面(实质开发中也是这么写的)。其实概要来讲,就是--就近原则(离被设置元素越近优先级别越高)。

  啥是选择器?

  在{}之前的部分就是“选择器”,“选择器”指明了{}中的“样式”有哪些用途对象,也就是“样式”用途于网页中的什么元素。

  标签选择器:标签选择器其实就是html代码中的标签。p{font-size:12px;line-height:1.6em;}

  类选择器:.类选器名字{css样式代码;}//用(.)

  ID选择器:#setGreen{color:green;}//用(#)

  类和ID选择器有什么区别相同点:可以应用于任何元素;不同的地方:1、ID选择器只能在文档中用一次。2、可以用类选择器词列表办法为一个元素同时设置多个样式。

  子选择器:即大于符号(>),用于选择指定标签元素的第一代子元素。.food>li{border:1pxsolidred;}

  包括(后代)选择器:包括选择器,即加入空格,用于选择指定标签元素下的后辈元素。.firstspan{color:red;}

  子选择器和包括选择器不同:>用途于元素的第一代后代,空格用途于元素的所有后代。

  通用选择器:用一个(*)号指定,它有哪些用途是匹配html中所有标签元素。*{color:red;}

  伪类选择器:它允许给html没有的标签(标签的某种状况)设置样式,譬如说大家给html中一个标签元素的鼠标滑过的状况来设置字体颜色,a:hover{color:red;}

  关于伪类选择符,到现在为止,可以兼容所有浏鉴器的“伪类选择符”就是a标签上用:hover了(其实伪类选择符还有不少,特别是css3中,但由于不可以兼容所有浏览器,本课程只不过讲了这一种最常见的)。其实:hover可以放在任意的标签上,譬如说p:hover,但它们的兼容性也是非常不好的,所以目前比较常见的还是a:hover的组合。

  分类选择符:当你想为html中多个标签元素设置同一个样式时,可以用分组选择符(,),如下代码为右边代码编辑器中的h1、span标签同时设置字体颜色为红色:h1,span{color:red;}
CSS 基础知识



希望以上内容可以解决您的问题!
如有其他问题欢迎大家一起交流学习!
作者:酱油妹 来源:www.nsxcb.cn 关注: 时间:2022-05-10 18:00
版权声明:凡注明来源为http://www.nsxcb.cn的均为本站原创,转载请注明来源。
本文网址:http://www.nsxcb.cn/CSS/CSS3/20220510/14147.html
凡本站提供教程均已验证教程的准确性。
相关教程
在线客服

织梦模板 整站模板 新手教程 使用技巧