web——day02

复习

1.html:浏览器解析执行
2.结构

  <html>
	<head>head>
        <body>body>
  html>

3.常用标签

  <br> <p> <h1-6>
  <img src="">
  <a href="http://.....">   <a id="">    <a href="#idname">
  <ul>   <ol>   <li>
  <table>

4.form
action=“处理程序”
method=“get/post”

  <textarea>
   <select>
   <option value="1001" > 北京市

css

1.选择器
元素选择器:选择器的名称是html标签名
选择器:

   .className{}    class=""

id选择器:

  #idName{}       id=""

后代选择器(子孙选择器)

div p{}

选择器

div > p{}

分组选择器

 div,#p1,.p3{}
   
   div + p{}
   div ~ p{}

2.使用的时候3中形式
style:内嵌式

  <p style="">
   <style>style>

外部的css文件*.css

3.盒子模型
内容+内边距+边框+外边距

4.块级元素


行内元素

<a><span><input><img>

5.和 文本相关

   font-family:
   font-size:
   color:
   text-align:
   line-height:
   text-decoration:
   list-style:

6.内边距和外边距

   margin:10px,10px,10px,10px;
   margin:10px,10px,10px;
   margin:10px,10px;
   margin:10px;
   margin-left:
   martgin-top:
   padding:10px,10px,10px,10px;
   padding:10px,10px,10px;
   padding:10px,10px;
   padding:10px;
   padding-left:
   padding-top:

7.背景

   background-color:
   background-image:url();

8.边框

   border:1px solid blue;

9.浮动
文档流:
脱离文档流:

  float:right;/left

文字会正常显示


定位

1.绝对定位
相对于父容器的,如果没有是body
可以作为定位的父容器的条件:必须有position属性,并且值为absolute,
relative,fixed其中一个
如果两个容器绝对定位的属性相同,那么后一个会覆盖前一个,包括文字
绝对定位的组件会随着窗口的滚动移动。

2.z-index属性

3.相对对位
保留组件文档流的位置

4.fixed(视口定位)
不随着窗口的滚动而移动


高度塌陷

两个容器中,内部容器的margin-top失效,
解决方案:
1.在外层容器中使用border
2.overflow:
3.margin-top改用padding-top


javascript

1.数据类型

字符串(String):""
str = “hello”;
var x = “abc”;
数值number:
var a = 2;
b = 3.4;
布尔型boolean
var b1 = true;
b2 = false

if(3){}//非0即为true  正确的

undefined:
var x ;
null;
var obj = null;

typeof(变量名):返回数据类型

2.弱类型 定义变量 var

var str;
变量的数据类型由值决定


3.运算符:
同java == ===

4.语句

  if(3){
	语句体;
	}
   for(var i=0;){
	
	}

5.函数
分类:自定义函数和系统函数

  function 函数名(参数列表){}

	//无参无返回值
	function fun1(){
		alert("fun1");		
	}
	//fun1();//调用函数
	//有参无返回值
	function fun2(x, y){
		alert(x+y);
	}
	fun2(2,3);
	function fun3(){
		return "hello";
	}
	alert(fun3());
	function fun4(x,y){
		return x+y;
	}
	alert(fun4(3,4));

内置对象

你可能感兴趣的:(定位,css,html,js,javascript)