CSS

1. CSS样式表的几种使用方式

1.元素内嵌

<p style="font-size"></p>

2.内部文档内嵌

<style type="text/css">
p{
font-family:Consolas;
font-size:24px;
}
</style> <p> 这是个段落 </p>

这样<p>标签就会表现出内部文档内嵌样式表的样式

3.外部文档内嵌

	<link  rel="stylesheet" type="text/css" herf="css/test.css">

4.导入式

    <style type="text/css">
// 导入式
@import “css/test.css”
</style>

注:

调用优先级别: 元素内嵌样式 > 内部文档内嵌 > 外部文档内嵌

2. CSS 选择器

  1. 选择所有元素
 <!--style元素-->
<style type="text/css">
*{ }
</style>
  1. 根据类型选择元素
<!--style元素-->
<style type="text/css">
a{
}
p{
}
</style>
<!--body 元素-->
<body>
<a> test </a>
<p> Test </p>
</body>
  1. 根据类选择元素
<!--style 元素:-->
<style type="text/css">
.class1{ }
</style>
<!--body 元素:-->
<body>
<p class="class1">Test </p>
</body>
  1. 根据ID 选择元素
<!--style 元素:-->
<style type="text/css">
#id1{ }
</style>
<!--body 元素:-->
<body>
<p id="id1"> Test </p>
</body>
  1. 根据属性选择元素
<!--style 元素:-->
<style type="text/css">
[href]{ }
</style>
<!--body 元素:-->
<body>
<a herf="test.html"> Test </a>
</body>
  1. :选择器动作
<!--style 元素:-->
<style type="text/css">
a:hover{
}
</style>
<!--body 元素:-->
<body>
<a> Test </a>
</body>

CSS 嵌入,及其选择器的更多相关文章

  1. 23----2013.07.01---Div和Span区别,Css常用属性,选择器,使用css的方式,脱离文档流,div+css布局,盒子模型,框架,js基本介绍

    01 复习内容 复习之前的知识点 02演示VS创建元素 03div和span区别 通过display属性进行DIV与Span之间的转换.div->span 设置display:inline   ...

  2. CSS基础--属性选择器、伪类选择器

    属性选择器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...

  3. CSS伪类选择器

    一.CSS伪类选择器用于给某些选择器添加效果语法规则:选择器:伪选择器例:a:link {color: #FF0000} 未访问的链接 a:visited {color: #00FF00} 已访问的链 ...

  4. Lining.js - 为CSS提供 ::nth-Line 选择器功能

    在CSS中,我们使用 ::first-line 选择器来给元素第一行内容应用样式.但目前还没有像 ::nth-line.::nth-last-line 甚至 ::last-line 这样的选择器.实际 ...

  5. CSS 子元素选择器与后代选择器区别实例讲解

    css子元素选择器和后代选择器在功能描述上非常相同,但是他们其实是有区别的,本文章通过两个简单的实例向大家介绍子元素选择器与后代选择器的区别,需要的朋友可以参考一下. 首先我们来了解一下子元素选择器与 ...

  6. CSS的总结(选择器,伪类等...)

    关于组合选择器可参考:http://www.cnblogs.com/starof/p/4453458.html 主要内容 CSS概述 CSS和HTML结合的四种方式 CSS样式优先级和代码规范 CSS ...

  7. 关于CSS伪类选择器

    #CSS伪类选择器 ##使用css伪类选择器需要注意的 使用css的伪类选择器来选择某元素时,需要特别注意 :first-child 和 :nth-child(n) 等时, 网页渲染是从语句的后面开始 ...

  8. CSS之后代选择器与多类选择器

    <新人报到,欢迎拍砖#- -> 一.后代选择器 说起CSS的后代选择器.它属于派生选择器中的一种,两者附属关系如下: -->派生选择器 ----CSS 后代选择器 ----CSS 子 ...

  9. jQuery的hover方法搭配css的hover选择器,实现选中元素突出显示

    问题简述: 今天做帮一个师姐做网页遇到一个这样的要求: 鼠标不移动进表格,表格透明度不变. 鼠标移动进表格,hover到的单元格透明度不变,没hover到的单元格透明度改变. 先贴我已经实现好的效果, ...

  10. css的各种选择器

    一.基本选择器 1. * 通用元素选择器,匹配任何元素 2. E 标签选择器,匹配所有使用E标签的元素 3. .info class选择器,匹配所有class属性中包含info的元素 4. #foot ...

随机推荐

  1. ImportError: cannot import name _imaging

    python - No module named 'PIL' - Stack Overflow  https://stackoverflow.com/questions/49247310/no-mod ...

  2. Windows 点击 模拟

    点击模拟  安卓模拟器  爬虫

  3. Android自己定义dialog中的EditText无法弹出键盘的解决

    近期我独立开发的项目<全医会>已经在内測其中了.非常快将会上架到各大应用市场.之前开发的几个项目都由于一些原因没有上架还是比較遗憾的.所以,近期我心情格外的好. 今天在做一个新项目,专为律 ...

  4. [JSOI 2016] 最佳团体

    [题目链接] https://www.lydsy.com/JudgeOnline/problem.php?id=4753 [算法] 很明显的分数规划 可以用树形动态规划(树形背包)检验答案 时间复杂度 ...

  5. [NOI 2014] 起床困难综合征

    [题目链接] https://www.lydsy.com/JudgeOnline/problem.php?id=3668 [算法] 从高位向低位贪心即可 时间复杂度 : O(30N) [代码] #in ...

  6. Flask的flask-sqlalchemy

    flask-sqlalchemy是Flask和SQLAlchemy的管理者 - db = SQLAlchemy() - 包含配置 - 包含ORM基类 - 包含create_all - engine - ...

  7. LED全彩显示屏色度空间

    摘要:LED全彩显示屏.LED电子大屏幕如果要有一个良好的视觉效果,其中色度占有一席重要的位置,那么该如何让LED显示屏的色度更均匀.合理呢,下面为大家总结出以下几点,供大家参考. LED全彩显示屏. ...

  8. 基于ELK的传感器数据分析练习

    目录 Sensor Data Analytics Application 数据构成 数据模型设计 Logstash配置 Kibana可视化 Sensor Data Analytics Applicat ...

  9. oracle创建数据库与配置监听器

    上述是数据库创建完毕 *检测创建 -------------------------------------------------------------2配置监听器---------------- ...

  10. ionic2.1.0 --beta3版本新建页面做弹框时遇到的问题

    新建的页面需要在app.module.ts文件中定义.不然制作页面弹出效果是会报错.