实验楼HTML基础入门学习

HTML基本介绍

HTML，一种描述网页的语言

结构

html
- head
  - title
  - script
- body
  - ...

文档

<html>
    <head>
            <title>.....</title>
    </head>

    <body>
            <p>.....</p>
    </body>
</html>

HTML文本

HTML元素

一个换行符

两个换行符

HTML属性

是在 HTML 元素的开始标签中定义。总是以名称和值对应的形式出现，比如：name="value"。属性值应该始终被包括在引号内。双引号是最常用的，不过使用单引号也没有问题

HTML文本格式化

常用

（bold）粗体
< big> （big）大字体
（emphasized）强调字
（italic）斜体
（small）小字体
(strong)加重语气

HTML样式

用style一气呵成的解决背景，颜色，各种

超文本

链接

< a href="http://www.shiyanlou.com">shiyanlou< /a>
target等于_self或_blank
添加提示文字title
一页中怎么停泊，锚

   <a href="#跳转目的地名称">跳转起始字符</a>
   ...
   ...
   ...
   <a name="跳转目的地名称">跳转目的地字符</a>

表格

     <table  align="center" border="1">  
            <tr>
            <td>first row and first column</td>
            <td>first row and second column</td>
            <td>first row and third column</td>
            </tr>

            <tr>
            <td>second row and first column</td>
            <td>second row and second column</td>
            <td>second row and third column</td>
            </tr>
     </table>

属性

border外边框
colspan：控制此单位所占列数
rowspan：控制此单位所占行数

HTML图像

<img src="path">
align属性，调整对齐bottom、middle、top左右可加的参数有right，left默认为right
width="80" height="80"
规定区域点击
- rect(矩形)、circle(圆形)、poly(多边形)
- coords有4个值，分别用逗号隔开，表示矩形区域左上角x坐标、左上角y坐标、右下角x坐标和右下角y坐标

    <map>
    <area shape="rect" coords="" href="" target="">
    </map

列表list(order, unorder)

<ol>
 <li>balabala</li> 
</ol>

有序：type, 采用什么排序;start, 以什么开始
无序：type，Disc（默认）实心黑点;Circle小圈;square方点

注释

<!--这是一段注释。注释不会在浏览器中显示。-->

HTML表单

用于数据的提交，评论

<form> 
<input type="radio" name="sex" value="male" /> Male 
<br/> 
<input type="radio" name="sex" value="female" /> Female 
</form>

type类型

usename, password
单选框radio, 多选框checkbox

基础汇总实验截取

选了表单方面，css什么暂时不管

<!DOCTYPE html>
<html>
<head>
    <title>test_form</title>
</head>
<body>
    <form action="MAILTO:support@shiyanlou.com" method="post" enctype="text/plain">
        <h3>Send email to shiyanlou</h3>
        your name:<br>
        <input type="text" name="name" value="yourname" size="20">
        <br>
        your email:<br/>
        <input type="text" name="mail" value="youremail" size="20">
        <br>
        what you want say:<br>
        <input type="text" name="comment" value="yourcomment" size="20">
        <br><br>
        <input type="submit" value="send">
        <input type="reset" value="reset">
    </form>
</body>
</html>

参考链接

实验楼前端路径