1.引入层叠样式表:

  A.行内引入

<bodystyle="background-color:#cccccc">;
在标签内使用style属性
</body>

 B.内联样式表

<html>
<head>
<title>内联样式表</title>
<style type="text/css">
body{
background-color:#ccc;
}
</style>
</head>
<body> </body>
</html>

  C.外部样式表

<html>
<head>
<title>外部样式表</title>
<link rel="stylesheet" href="index.css" type="text/css">
</head>
<body> </body>
</html>

2.三种样式表的优先级对比(就近原则)

  行内引入 > 内联样式表 > 外部样式表

3.代码注释:

  /* 代码段 */

CSS:
  /* background-color:#ccc; */

4.各浏览器前缀

     前缀            浏览器
-webkit-   chrome和safari
-moz-       firefox
-ms-       IE
-o-   opera

  

  
  

 

5.CSS选择符:

  A. 通配选择符

CSS:
*{
代码块;
}

  B. 元素选择符,路body、h1、p

CSS:
body{
代码块;
}
h1{
代码块;
}

  C. 群组选择符

CSS:
h1,h2,p{
代码块;
}

  D. 关系选择符

HTML: (包含选择符 E F)
<div>
<a>我是div的子元素a标签</a>
</div>
  <p>
    <a>我是p的子元素a标签</a>
  </p>
CSS:
div p{
代码块;
}

 

HTML:(子选择符 E>F)
  <div>
<a>我是div的子元素a标签</a>
</div>
  <p>
    <a>我是p的子元素a标签</a>
  </p>
CSS:
  div>p{
    代码块;
  }

CSS基础知识,学前准备的更多相关文章

  1. 前端开发:css基础知识之盒模型以及浮动布局。

    前端开发:css基础知识之盒模型以及浮动布局 前言 楼主的蛮多朋友最近都在学习html5,他们都会问到同一个问题 浮动是什么东西?  为什么这个浮动没有效果?  这个问题楼主已经回答了n遍.今天则是把 ...

  2. CSS基础知识之float

    前段时间写过一篇CSS基础知识之position,当时对float的理解不太准确,被慕课网多名读者指出(原文已修正,如有误导实在抱歉).现对float进行更深入的学习,在此把学习心得分享给大家. 浮动 ...

  3. (转)第一天 XHTML CSS基础知识 文章出处:标准之路(http://www.aa25.cn/div_css/902.shtml)

    欢迎大家学习<十天学会web标准>,也就是我们常说的DIV+CSS.不过这里的DIV+CSS是一种错误的叫法,建议大家还是称之为web标准. 学习本系列教程需有一定html和css基础,也 ...

  4. CSS基础知识之position

    最近在慕课网学习了 网页布局基础 和 固定层效果 ,都是由声音甜美的 婧享人生 老师所录制,视频详细讲解了CSS中position的用法,在此把学习笔记分享给大家. CSS定位机制 标准文档流(Nor ...

  5. 【CSS】 CSS基础知识 属性和选择

    css基础知识 html的基本标签都是千篇一律的,为了能够个性化外观,就需要进行样式的调整,而css就是专门用来维护,管理样式的一种格式.在html中定义css有三种方法 1. 为标签添加style属 ...

  6. CSS基础知识01

    一.CSS基础知识介绍 1.css是cascading style sheet层叠式样式表的简写 2.css小用法 加粗:font-weight:bold;             正常用:norma ...

  7. 〖前端开发〗HTML/CSS基础知识学习笔记

    经过一天的学习,把慕课网的HTML/CSS基础知识学完了,笔记整理: 1. 文件结构: HTML文件的固定结构: <html> <head>...</head> & ...

  8. Web学习篇之---css基础知识(一)

    css基础知识(一) 1.css样式: 载入css样式有下面四种: 1).外部样式 2).内部样式 3).行内样式 4).导入样式 <link href="layout.css&quo ...

  9. DIV+CSS专题:第一天 XHTML CSS基础知识

    欢迎大家学习<十天学会web标准>,也就是我们常说的DIV+CSS.不过这里的DIV+CSS是一种错误的叫法,建议大家还是称之为web标准.   学习本系列教程需有一定html和css基础 ...

  10. HTML+CSS基础知识(2)选择器的使用、盒子模型的讲解、列表的使用

    文章目录 1.CSS基础知识 2.css样式 2.1.代码: 2.2 测试结果 3.CSS的语法 3.1 代码 4.块元素和行内元素 4.1 代码 4.2 测试结果 5.常用的选择器 5.1 代码块 ...

随机推荐

  1. cocos进阶教程(5)CC_CALLBACK_X系列的使用技巧

    CC_CALLBACK_1,CC_CALLBACK_2,CC_CALLBACK_3 这些都是std::bind的宏,数字1,2,3主要表示要占位的数量,也是将来传递参数的数量. // new call ...

  2. #C++初学记录(素数判断)

    练习题目二 素数判断 A prime number is a natural number which has exactly two distinct natural number divisors ...

  3. 1:1 Struts2概述

    jar包下载

  4. A题:Common Substrings(KMP应用)

    原题链接 注意:2号和3号get_next()函数中next[i]赋值时的区别,一个是0,一个是1,且不能互换 #include<cstdio> #include<cstring&g ...

  5. win7 +v Ubuntu 16.04 grub rescue 模式下修复 grub

    前几天整理了下电脑的分区,合并并删除一些分区,结果导致 grub 被破坏了,Ubuntu进不去了,启动后直接进入了 rescure 模式.后来又折腾了下,终于修复好了,现总结一下. 先说一下我的系统环 ...

  6. zw版【转发·台湾nvp系列Delphi例程】HALCON SetWindowExtent

    zw版[转发·台湾nvp系列Delphi例程]HALCON SetWindowExtent unit Unit1;interfaceuses Windows, Messages, SysUtils, ...

  7. Conductor

    https://netflix.github.io/conductor/ High Level Architecture

  8. 【图像处理】计算Haar特征个数

    http://blog.csdn.net/xiaowei_cqu/article/details/8216109 Haar特征/矩形特征 Haar特征本身并不复杂,就是用图中黑色矩形所有像素值的和减去 ...

  9. [one day one question] safari缓存太厉害

    问题描述: safari缓存太厉害,这怎么破? 解决方案: window.onpageshow = function(event) { if (event.persisted) { window.lo ...

  10. 什么是TensorFlow Serving

    答:1. 从Serving 可以看出,与服务有关; 2. 那么为啥还有TensorFlow的前缀?肯定与TensorFlow有着很大的关系: 3. 那么Tensorflow是用来干什么的呢?Tenso ...