黑马程序员_html

来源：互联网发布：三峡好人知乎编辑：程序博客网时间：2024/04/28 05:50

------- android培训、java培训、期待与您交流！ ----------

1.html基础

1.1 html是什么？
超文本标记语言是一种用来设计网页的标记语言,用该语言编写的文件,以html或者
.html为后缀,并且由浏览器解释执行,生成相应的界面。

1.2 html文件的基本结构
html的基本基本结构分为两大部分:头(head)和体(body)

1.2.1 文件的基本结构
1)html头标记,写描述页面的数据
2)html体标记,与页面显示的内容有关系
<html>
</head></head>
<body></body>
</html>

1.2.2 <meta>
1)主要用于设置消息头
2)消息头:
浏览器访问服务器时,服务器会发送的一些键值对
<meta http-equiv="content-type" content="text/html;charser=utf-8">
<html>
<head>
<title>标题</title>

<meta http-quiv="content-type"
content="text/html;charset=utf-8">
</head>
<body></body>
</html>

案例演示:引入css样式文件
style.css
body{
font-size:60px;
color:red;
font-style:italic;
}

first.html
<html>

<head>
<link rel="stylesheet"
type="text/css"
href="style.css">
</head>
<body>
hello world
</body>
</html>

1.2.3 引入脚本
·重点掌握5个重要的标记
<html>
<head>
<script src="c1.js"></script>
<script></script>
</head>
<body></body>
</html>

1.2.4 <body>中的标签
<html>
<head>
</head>
</html>

<head></head>

<body>

<a href=""></a>

<table>

<form>

<ul>,<ol>

<ifram>,<framest>
</body>
</html>

2.几个重要的标记
2.1 链接<a href>
2.11基本使用
<a href="url地址" target="" title="">描述性的文字</a>
href属性:             指定链接的地址
target属性:           指定在哪个窗口打开链接,值可以指定为
·_slef:              在当前窗口打开链接,值可以指定为:
·_blank              在新窗口打开
·tiltle:             提示信息

2.2 表格的基本结构
<table border="" width="" cellspaing="" cellpadding="">
    <tr align="">
    <td align=""></td>
    <td></td>
    </tr>
</table>
border:       框架的宽度,单位是像素
width:        表格的宽度
              可以用百分比,也可以是绝对值
cellspacing: 单元格内容与单元格之间的空隙
cellspacing: 单元格内容与单元格之间的空隙
align:        水平对齐,值"cemter","right","left"

2.3 表单的基本语法
<form action="" method="" enctype="">
   input标记
   非input标记
</form>
action属性:    表单提交由哪个程序来处理
method属性:    表单提交方式
entype属性:    设置表单的MIME编码

2.4 表单的主要标记
1) 文本输入框
type属性:     input标记的具体类型
              type内容可以不写,默认是文本框
name属性:     标记的一个名称,该名称用于生成一个请求参数
value属性:    缺省值

2) 密码输入框
<input type="radio" name="" value="" checked="checked">
value属性: 发送给服务器端的值
checked属性: 就一个值"checked",表示缺省值被选上

3)单选
<input type="radio" name="" checked="checked"/>
checked属性: 就一个值"checked",表示缺省被选上

4) 多选
<input type="checkbox" name="" value="" checked=""/>

5)文件上传
<input type="file" name=""/>

6)提交按钮
<input type="submit" value="comfirm'>

7)重置按钮
<input type="reset" value="reset"/>

8)下拉菜单
<select name="" multiple="">
<option value=""></option>
</select>

------- android培训、java培训、期待与您交流！ ----------