栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > Html/CSS > CSS教程

CSS样式基础

CSS教程 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

CSS样式基础

CSS样式

标签(空格分隔): css


定义

CSS:全称为“层叠样式表 (Cascading Style Sheets)”,它主要是用于定义HTML内容在浏览器内的显示样式,如文字大小、颜色、字体加粗等。

语法

![此处输入图片的描述][1]
选择符:称选择器,页中要应用样式规则的元素。
声明:在英文大括号“{}”中的的就是声明,属性和值之间用英文冒号“:”分隔。当有多条声明时,中间可以英文分号“;”分隔。

注释

就像在Html的注释一样,在CSS中也有注释语句:来标明(Html中使用)。就像下面代码:

p{

    color:red;
    font-size:12px;
}
CSS样式的位置
  • 内联式:把css代码直接写在现有的HTML标签中,如下面代码:

    这里文字是红色。

  • 嵌入式:把css样式代码写在标签之间。如下面代码实现把三个标签中的文字设置为红色:

    
    span{
    color:red;
    }
    

    注意:
    嵌入式css样式必须写在之间,并且一般情况下嵌入式css样式写在之间。

  • 外部式:把css代码写一个单独的外部文件中,这个css样式文件以“.css”为扩展名,在内(不是在标签内)使用标签将css样式文件链接到HTML文件内,如下面代码:

    注意:
    1、css样式文件名称以有意义的英文字母命名,如 main.css。
    2、rel="stylesheet" type="text/css" 是固定写法不可修改。
    3、标签位置一般写在标签之内。

优先权

内联式 > 嵌入式 > 外部式



嵌入式css样式


    span{
  color:red;
    }

注意:
1、嵌入式>外部式有一个前提:嵌入式css样式的位置一定在外部式的后面。如右代码编辑器就是这样,代码在...代码的前面(实际开发中也是这么写的)。感兴趣的小伙伴可以试一下,把它们调换顺序,再看他们的优先级是相反的。
2、其实总结来说,就是--就近原则(离被设置元素越近优先级别越高)。
3、但注意上面所总结的优先级是有一个前提:内联式、嵌入式、外部式样式表中css样式是在的相同权值的情况下,什么是权值呢?(思考一下)

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/243516.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号