web基础知识总结

决定要开始写博客,先把之前的东西总结一下好了。以前培训的时候学到的一些基础知识,做下笔记备用。w3cSchool也是一个很好的学习这些知识的地方。

web基础知识回顾

(一)web界面开发的三个基本技术【html、css、js】

1.html:超文本标记语言(告诉浏览器显示什么)

2.css:层叠样式表(告诉浏览器如何显示)

3.js:客户端脚本语言(告诉浏览器如何交互)


(二)用记事本写一个最最简单的html界面。

         

                   标题

         

         内容



(三)常用的标记:


换行

 

段落

删除线

粗体

下划线

斜体

  1-6  字体大小

下标

上标


水平线

超链接

。。。。。。标签还有很多,就不一一往上放了。



(四)颜色表示机制(三种)

  •   英文颜色名:red、blue、yellow、gray、white、black、green、orange。。。。。
  •   十六进制颜色编码(RGB):#RRGGBB    #FF0000红色  #000000
  •   使用rgb函数:  rgb(r,g,b) 0-255   rgb(255,0,0)



(五)几点要注意的事:

  •         页面的主文件名不要使用中文和空格以及特殊字符    $ni好.html
  •          讲究格式(缩进)
  •          HTML不区分大小写,标记名和属性名应该小写
  •          属性的值使用双引号引起
  •          单标记使用自封闭写法   <标记名 />
  •          资源的名字不要使用中文和空格
  •          资源基本上都要使用相对路径
  •          关键图片必须有title和alt两个属性,两个属性值不一样

 

 

(六) PS的使用(处理图像)

  •   截取屏幕: alt +prscrn
  •   tab 隐藏/显示面板
  •   alt + 鼠标滚轮    缩/放 视图
  •   ctrl + 放大  ctrl- 缩小
  •   缩放框 直接输入数值
  •   Space + 鼠标左键  移动图片
  •   修改单位:编辑-》首选参数-》单位与标尺-》像素
  •   量大小:选择工具 –》信息面板
  •   显示标尺:视图 –》标尺
  •   取消选取:ctrl + D

 


 (七)滚动 + 鼠标的感应

  •   使用标记滚动的内容
  •   修饰滚动:
  •   方向:direction   left|right|up|down
  •   区域:width 宽   height 高
  •   速度:scrollamount步长(像素),scrolldelay频率(毫秒)
  •   感应:οnmοuseοver="this.stop()"   οnmοuseοut="this.start()"

(八)  列表

  •   无序列表
  •    
    • …..
    • …..
  •   通过type属性,选择项目符号
  •   有序列表
  •  
    1. …..
    2. …..

(九) 表格

  •   数据管理、布局管理
  •   标记:
    、、
  •   属性:
  •   border 边框
  •   cellpadding 填充   cellspacing间距
  •   width 宽  height 高
  •   colspan 合并列  rowspan合并行

(十)    CSS样式表控制样式

  •   新建CSS文件    .css
  •   导入样式表文件
  •   规则:
  • 选择器{属性:值;  属性:值;  …..}
  •   选择器分类
  •   标记选择器:HTML标记
  •  ID选择器:id=””     #id
  •  类选择器:class=””   .类名

 


(十一)  表单

  • 作用在于获取用户的信息
  • 使用
    表单
  •  属性:
  •  name 名字
  •  action 提交对象
  •  method 提交方式 get|post

-         表单元素

  •  
  •   类型:
  •   text 文本框
  •  password 密码框
  •   radio 单选按钮  name相同才能互斥,checked默认选中
  •  checkbox  复选框
  •   file 文件域
  •   submit 提交按钮   value按钮文本
  •   reset 重置按钮
  •   button 空白按钮
  •  
  •  

  …….

  •  

(十二)   表格布局

  • 新建:30原则【行、列、宽】
  • 属性:ID、对齐
  •  留白:margin外留白、padding内留白
(十三) 盒子模型


  •  容器和内容
  •  
    块标记
  •   行级标记

(十四)   框架

  •   浏览器窗口的分割技术
  •   框架集:特殊页面,负责分割浏览器
  •   分割:按行(rows=”,”),按列分(cols=””)
  •   子窗口:
  •   noresize 不允许改变子窗口大小
  •   scrolling  auto  no  yes
  •     无边框
  •   框架集的嵌套

-         超链接的目标窗口

  •   target属性
  •   目标框架名字
  •   _blank  新窗口
  •   _self 自己窗口
  •   _top 顶级窗口中打开

-         动态日期

  •   新建的JS脚本文件
  •   导入脚本文件

  •   JS语法
  •   两个对象:window、document
  •   获取页面元素的方法:document.getElementById(“xxxx”).innerHTML
  •   Date()日期时间对象
    •   .getYear() 获取年份
    •   .getMonth() 获取月份   0-11
    •   .getDate() 获取日  0-6  日-六

(十五)JS的应用

-         JS的基本使用

  •   JavaScript:客户端程序段
  •   HTML如何使用JS脚本(三种)
  •   <标记事件名=”执行”>
  •   使用

你可能感兴趣的:(基础知识总结)