CSS基础知识,学前准备
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基础知识,学前准备的更多相关文章
- 前端开发:css基础知识之盒模型以及浮动布局。
前端开发:css基础知识之盒模型以及浮动布局 前言 楼主的蛮多朋友最近都在学习html5,他们都会问到同一个问题 浮动是什么东西? 为什么这个浮动没有效果? 这个问题楼主已经回答了n遍.今天则是把 ...
- CSS基础知识之float
前段时间写过一篇CSS基础知识之position,当时对float的理解不太准确,被慕课网多名读者指出(原文已修正,如有误导实在抱歉).现对float进行更深入的学习,在此把学习心得分享给大家. 浮动 ...
- (转)第一天 XHTML CSS基础知识 文章出处:标准之路(http://www.aa25.cn/div_css/902.shtml)
欢迎大家学习<十天学会web标准>,也就是我们常说的DIV+CSS.不过这里的DIV+CSS是一种错误的叫法,建议大家还是称之为web标准. 学习本系列教程需有一定html和css基础,也 ...
- CSS基础知识之position
最近在慕课网学习了 网页布局基础 和 固定层效果 ,都是由声音甜美的 婧享人生 老师所录制,视频详细讲解了CSS中position的用法,在此把学习笔记分享给大家. CSS定位机制 标准文档流(Nor ...
- 【CSS】 CSS基础知识 属性和选择
css基础知识 html的基本标签都是千篇一律的,为了能够个性化外观,就需要进行样式的调整,而css就是专门用来维护,管理样式的一种格式.在html中定义css有三种方法 1. 为标签添加style属 ...
- CSS基础知识01
一.CSS基础知识介绍 1.css是cascading style sheet层叠式样式表的简写 2.css小用法 加粗:font-weight:bold; 正常用:norma ...
- 〖前端开发〗HTML/CSS基础知识学习笔记
经过一天的学习,把慕课网的HTML/CSS基础知识学完了,笔记整理: 1. 文件结构: HTML文件的固定结构: <html> <head>...</head> & ...
- Web学习篇之---css基础知识(一)
css基础知识(一) 1.css样式: 载入css样式有下面四种: 1).外部样式 2).内部样式 3).行内样式 4).导入样式 <link href="layout.css&quo ...
- DIV+CSS专题:第一天 XHTML CSS基础知识
欢迎大家学习<十天学会web标准>,也就是我们常说的DIV+CSS.不过这里的DIV+CSS是一种错误的叫法,建议大家还是称之为web标准. 学习本系列教程需有一定html和css基础 ...
- HTML+CSS基础知识(2)选择器的使用、盒子模型的讲解、列表的使用
文章目录 1.CSS基础知识 2.css样式 2.1.代码: 2.2 测试结果 3.CSS的语法 3.1 代码 4.块元素和行内元素 4.1 代码 4.2 测试结果 5.常用的选择器 5.1 代码块 ...
随机推荐
- onsubmit不起作用的原因
使用form表单,添加onsubmit="return check()",来实现提交前进行相关验证功能时,有时会出现js函数不起作用的情况, 此时可以检查相应的js函数check( ...
- hdu5009
这题说的是给了一个 长度为n(n<=50000)的数列,数列表示的是给每个珍珠涂的颜色,任务是将一窜长度为n的珍珠涂成他所要的颜色.然后你可以操至多n次, 每次画只能画连续的区间,每次操作是的 ...
- uva1401 dp+Trie
这题说的是给了一个长的字符串长度最大300000,又给了4000个单词 单词的长度不超过100.计算这个字符串能组成多少种不同单词的组合,求出方案总数.dp[i]以第i个字符为开始的字符串能有多少种的 ...
- 《Python网络编程基础》第四章 域名系统
域名系统(DNS) 是一个分布式的数据库,它主要用来把主机名转换成IP地址.DNS以及相关系统之所以存在,主要有以下两个原因: 它们可以使人们比较容易地记住名字,如www.baidu.com. 它 ...
- 基于SSH RSA的信任关系
RSA 非对称加密算法 client ---> server 私钥 公钥 1. 客户端生成密钥对 ssh-keygen -t rsa 执行后产生的密钥对会分别追加写到当前用户家目录下的以下文 ...
- Spring 整合Mybatis 出现了Cause: org.springframework.jdbc.CannotGetJdbcConnectionException: Could not get JDBC Connection; nested exception is org.apache.commons.dbcp.SQLNestedException: Cannot create Poola
我出现的 报错信息如下: ### Error querying database. Cause: org.springframework.jdbc.CannotGetJdbcConnectionExc ...
- KVM入门
KVM KVM(Kernel-based Virtual Machine)是众多虚拟化技术之一,它是Linux内核中的一个模块,该模块依赖于CPU,如果CPU支持虚拟化,那么该模块才可以被加载.KVM ...
- python webdriver 登录163邮箱发邮件加附件, 外加数据和程序分离,配置文件的方式
配置文件:UiObjectMapSendMap.ini用来存放配置信息 GetOptionSendMail.py 用来读取配信息 #encoding=utf-8from selenium.webdri ...
- 20145104张家明 《Java程序设计》第3周学习总结
20145104张家明 <Java程序设计>第4周学习总结 教材学习内容总结 第四章 认识对象 4.1 类与对象 4.1.1 定义类 类定义时使用class关键词,建立实例要用new关键词 ...
- 20145204 《Java程序设计》第7周学习总结
20145204 <Java程序设计>第7周学习总结 教材学习内容总结 时间 GMT.UT.TAI 格林威治标准时间(GMT)的正午是太阳抵达天空最高点之时,因为地球公转轨道为椭圆且速度不 ...