HTML&JavaScript
Html：==================================================================================
Head相关
Meta 描述属性
Style 样式
Script 脚本
字体相关
h1 ... h6 字体的大小 一次变小
p 段落标签 换行且有段间距
pre 预备役标签，保留你的输出
font --> size | color 字体变化，设置大小和颜色
b | strong 加粗
center 居中
em 斜体，着重显示，不同的显示器，着重显示不一样
br 换行符
hr 分割线
图片/超链接
图片 img src（名字） | width height（宽高） | alt （图片找不到的时候显示的东西） | align（控制写在图片之后文字的位置 bootom 下方middle中间） | border （控制图片边框）
超级连接a href（连接目标的url） | name（锚点名） | target （4个备选 _new第一次连接开一个新窗口，第2，3次在同一个窗口里刷新 _self自己窗口里打开 _blank连接打开一个新窗口，点几次开几个窗口 _top（我在最顶端，把frameset框架替换了，要代替真个框架显示出来））href=“#”表示本页面
表格
table (tbody) border | bordercolor | bgcolor | cellsapcing | width height | align
|- tr
|- td colspan | rowspan 和并列| 合并行
表单
form --> method | action
|- input --> type : text | password | checkbox | radio | button | submit | reset | hidden
|- select
|- option
|- textarea --> cols rows
name=value
框架
frameset ---> 不允许出现body ---> rows cols
|- frame ---> name | src
C/S B/S
web 1.0 ---> 发布式体系
web 2.0 ---> 强调用户参与 ---> blog
==================================
internet ---> 铺路
web ---> 车
http --- 底层传输层协议 来自于ARPA
---> 无状态协议
---> 一次性连接
---> 80端口
HTML ---> 标识性语言 --- 被浏览器解释
Active X
W3C制定的
<body xxx="xxx">
xxxx
</body>
---------------------
<html>
<head> ---->
</head>
<body>
</body>
</html>
字体相关标签
<h1 --- h6>
<p> <pre>
<font size color>
<center>
<br><hr>
<b><strong>
图片\超链接
<img>
|- src
|- width height
|- alt
|- align
<a>
|- target ---> _new _self _blank _top 如果不加_表示一个frameset的name
|- href
|- name
表格
<table> --> border | bordercolor | width / heigth | align | cellspacing
|- <tr>
|- <td> ---> colspan | rowspan
表单
<form>
|- method
|- get
参数以URL方式进行提交
参数用来提交给服务器看,需要服务器端主动拿取
缺点: 不安全
URL长度有限制
编码问题
|- post
参数包含在请求体中提交
服务器端直接从请求中获得数据
|- action
file:///C:/Documents%20and%20Settings/user/桌面/html/form.html
? --> 连接符 表示后面提交参数
userName=kettas
& --> 参数连接符用于多个参数分隔
password=123456
&radio1=hibernate
&heshang=JinChuangGuang
&heshang=SunShuai&sel=tianjin
<input>
</form>
框架<frameset>
<html>
<frameset rows="15%, 70%, 15%">
<frame name="title" src="title.html">
<frameset cols="15%,*">
<frame name="leftBar" src="leftBar.html">
<frame name="main" src="main.html">
</frameset>
<frame name="footer" src="footer.html">
</frameset>
</html>
Inputàtype:text文本|password|checkbox多选框||radio单选框|botton|submit|reset
Select下拉列表 option标签
Textarea
==================================================================================================
1) Css （Cascading Style Sheets）什么用
优点: 1 避免传统html标签过于繁琐的步骤
2 比传统html标签更灵活
3 可重用性
<head>
<style type="text/css">
h1.rb, h2.rb{
color : red;
background-color : black ;
}
h1.gy{
color :green ;
background-color : yellow;
}
#p1{
color : red;
}
.mylayout{ //一般用点号“。”后面是css的名字
color:red;
}
</style>
</head>
<body>
<h1 class="rb">Hello Css World!</h1>
<h1 class="gy">Have a nice day!</h1>
<h1 class="rb">Good luck & Have fun!</h1>
<h2 class="rb">this is h2 line</h2>
<h3 class="rb">this is h3 line</h3>
<p id="p1">this is p line</p>
<textarea class=”mylayout”/> 用class调用css
2) selector{
property : value;
}
3) 外部引入css 使用的时候和内部一样
1) <style type="text/css"></style>
2) <link rel="stylesheet" type="text/css" href="…/home.css"/>
3) nested
内部标签使用 <h1 style="color:blue">this is 3 line</h1>
4，常用的css相关标签
文本相关
text-align : left | center | right
text-indent : 10px ;
color : 制定文字颜色
字体相关
font-family : 字体：
“times new Roman" , times , serif ....
font-weight : normal , bold , lighter , bolder
font-size : xxxx
% , smaller , larger .font-size:10pt}
.s1 {font-size:16px}
.s2 {font-size:16pt}
.s3 {font-size:80%}
.s4 {font-size:larger}
.s5 {font-size:xx-large}
letter-spacing : 字符间隔
word-spacing : 单词间隔
.p1 {text-indent: 8mm}
.d1 {width:300px}
.p2 {text-indent:50%}
颜色背景
background-color :
background-image:url( images/xxxx.jpg )---背景图片
background-repeat : 决定显示方式。
repeat : 重复显示
repeat-x : 左上方开始横向重复显示。
repeat-y : 纵向重复显示
*no-repeat : 只显示一次 。
关于div span
边框相关
border : style width color
style : 边框的种类.
none , hidden , dotted , dashed, solid , double, groove , ridge, inset , outset
border-style :
border-top-style :
border-left-style :
border-right-style:
border-bottom-style :
border-width:
border-top-width:
border-left-width:
border-right-width:
border-bottom-width:
border-color :
border-top-color:
border-left-color:
border-right-color:
border-bottom-color:
高度，宽度 ：
width : height :
补白:变相的缩进
padding:
padding-top
padding-right
padding-left
padding-bottom
margin:
margin-top
margin-right
....................
扫一扫
705
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
