如何在HTML5中引入css和选择器

  介绍

今天就跟大家聊聊有关如何在HTML5中引入css和选择器,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。

什么是css

css是一种用来表现HTML或XML等文件样式的计算机语言,主要是用来设计网页的样式,使网页更加美化。它也是一种定义样式结构如字体,颜色,位置等的语言,并且css样式可以直接存储于HTML网页或者单独的样式单文件中,而样式规则的优先级由css根据这个层次结构决定,从而实现级联效果,发展至今,css不仅能装饰网页,也可以配合各种脚本对于网页进行格式化。

01。引入css方式(重点掌握)
行内样式
内接样式
外接样式
3.1链接式
3.1导入式
css介绍
现在的互联网前端分三层:
HTML:超文本标记语言。从语义的角度描述页面结构。
css:层叠样式表。从审美的角度负责页面样式。
JS: JavaScript。从交互的角度描述页面行为
css:层叠样式表,层叠样式表。css的作用就是给HTML页面标签添加各种样式,定义网页的显示效果。简单一句话:css将网页内容和显示样式进行分离,提高了显示功能。
css的最新版本是css3,我们目前学习的是css2.1
接下来我们要讲一下为什么要使用css。
HTML的缺陷:
不能够适应多种设备
要求浏览器必须智能化足够庞大
数据和显示没有分开
功能不够强大
css优点:
使数据和显示分开
降低网络流量
使整个网站视觉效果一致
使开发效率提高了(耦合性降低,一个人负责写HTML、一个人负责写css)
比如说,有一个样式需要在一百个页面上显示,如果是HTML来实现,那要写一百遍,现在有了css,只要写一遍。现在,HTML只提供数据和一些控件,完全交给css提供各种各样的样式。
行内样式

 1, & lt; div>
  2,& lt; p 风格=把丈?,green"在我是一个段落& lt;/p>
  3,& lt;/div> 

内接样式
复制代码

 & lt; style 类型=拔谋?css"比;/*写我们的css代码*/,,,,
  跨度{
  颜色:黄色;
  }
  & lt;/style> 

复制代码
外接样式——链接式

 & lt; link  rel=皊tylesheet", href=https://www.yisu.com/zixun/薄?index.css”>
  外接样式——导入式
  <风格type=" text/css ">
  @ import url ('/index.css。');
   

02. css的选择器:
1。基本选择器2。高级选择器
基本选择器包含:
1。标签选择器
标签选择器可以选中所有的标签元素,比如div、ul、李、p等等,不管标签藏的多深,都能选中,选中的是所有的,而不是某一个,所以说“共性”而不是“特性”
复制代码
身体{
颜色:灰色;
字体大小:12 px;
}
/标签选择器/
p {
颜色:红色。
字体大小:20 px;
}
跨度{
颜色:黄色;
}
复制代码
2。id选择器
选中id
同一个页面中id不能重复。
任何的标签都可以设置id
id命名规范要以字母可以有数字下划线——大小写严格区分aa和aa是两个不一样的属性值
复制代码

 1, #{盒子
  2,背景:绿色;
  3,}
  4,
  5,# s1 {
  6,颜色:红色;
  7,}
  8,
  9日,# s2 {
  10,字体大小:30 px;
  11,}

复制代码
3。类选择器
所谓类:就是类。类与id非常相似任何的标签都可以加类,但是类是可以重复,属于归类的概念。同一个标签中可以携带多个类,用空格隔开
类的使用,能够决定前端工程师的css水平到底有多牛逼?
玩类了,一定要有“公共类”的概念。
复制代码

 .lv {
  ,颜色:绿色;
  }
  .big {
  字体大小:40像素;
  }
  .line {
  文字修饰:下划线;
  }



<>之前,& lt; div>   ,,,,& lt; p 类=發v  big"在段落1 & lt;/p>   ,,,,& lt; p 类=發v  line"在段落2 & lt;/p>   ,,,,& lt; p 类=發ine  big"在段落3 & lt;/p>   ,& lt;/div>

看完上述内容,你们对如何在HTML5中引入css和选择器有进一步的了解吗?如果还想了解更多知识或者相关内容,请关注行业资讯频道,感谢大家的支持。

如何在HTML5中引入css和选择器