1.浏览器样式前缀
为了让CSS3样式兼容,需要将某些样式加上浏览器前缀:
-ms- 兼容IE浏览器
-moz- 兼容firefox
-o- 兼容opera
-webkit- 兼容chrome 和 safari
比如:
div
{
-ms-transform: rotate(30deg);
-webkit-transform: rotate(30deg);
-o-transform: rotate(30deg);
-moz-transform: rotate(30deg);
transform: rotate(30deg);
}
各个浏览器内核和前缀
Chrome(谷歌浏览器) :WebKit内核 -webkit-
Safari(苹果浏览器) :WebKit内核 -webkit-
Firefox(火狐浏览器) :Gecko内核 -moz-
IE(IE浏览器) : Trident内核 -ms-
Opera(欧朋浏览器) :Presto内核 -o-
所谓的浏览器内核也就是浏览器所采用的渲染引擎,渲染引擎决定了浏览器如何显示网页的内容以及页面的格式信息。不同的浏览器内核对网页编写语法的解释也有不同,因此同一网页在不同的内核的浏览器里的渲染(显示)效果也可能不同,这也是网页编写者需要在不同内核的浏览器中测试网页显示效果的原因。
下面是对内核的介绍:
1. Trident内核代表产品Internet Explorer,又称其为IE内核。Trident(又称为MSHTML),是微软开发的一种排版引擎。使用Trident渲染引擎的浏览器包括:IE、傲游、世 界之窗 浏览器、Avant、腾讯TT、Netscape 8、NetCaptor、Sleipnir、GOSURF、GreenBrowser和KKman等
2.Gecko内核代表作品Mozilla FirefoxGecko是一套开放源代码的、以C++编写的网页排版引擎。Gecko是最流行的排版引擎之一,仅次于Trident。使用它的最著名浏览器有Firefox、Netscape6至9。
3.WebKit内核代表作品Safari、Chromewebkit 是一个开源项目,包含了来自KDE项目和苹果公司的一些组件,主要用于Mac OS系统,它的特点在于源码结构清晰、渲染速度极快。缺点是对网页代码的兼容性不高,导致一些编写不标准的网页无法正常显示。主要代表作品有Safari和Google的浏览器Chrome。
4.Presto内核代表作品OperaPresto是由Opera Software开发的浏览器排版引擎,供Opera 7.0及以上使用。它取代了旧版Opera 4至6版本使用的Elektra排版引擎,包括加入动态功能,例如网页或其部分可随着DOM及Script语法的事件而重新排版。
2.JS代码需要编写到script标签中
/*
控制浏览器弹出一个警告框
alert("宁姐,你真漂亮!!");
*/
/*
让计算机在页面中输出一个内容
document.write()可以向body中输出一个内容
*/
/*
向控制台输出一个内容
console.log()的作用是向控制台输出一个内容
*/
3.js编写位置
js/script.js"></script>
alert("我是内部的JS代码");
</script>
<!-- <script type="text/javascript">
alert("我是script标签中的代码!");
</script> -->
4.js基本语法
/*
JS注释
*/
// 单行注释
alert("hello");
// document.write("hello");
console.log("hello"); // 该语句用来在控制台输出一个日志
5.字面量和变量
/*
字面量(常量),都是一些不可改变的值
比如 :1 2 3 4 5 "hello"
x = 123456789123
*/
var a; // 默认值undefined
a = 123;
a = 456;
a = 123456789123;
var b = 789;
var c = 0;
var age = 80;
console.log(age);
6.标识符
/*
标识符
- 在JS中所有的可以由我们自主命名的都可以称为是标识符
helloWorld xxxYyyZzz
*/
// var a_1_$# = 123;
// var $abc1 = 123;
// var if = 123;
// var HelLoWoRld = 123;
// var 锄禾日当午 = 789;
// console.log(锄禾日当午);