我的暑期实训的处女笔记

来源：互联网发布：mac qq怎么退出编辑：程序博客网时间：2024/05/01 04:50

今天首先讲了最基础的知识。如HTML的标签，HTML标签最外层标签包括head头标签，与body标签。在head中可写CSS样式和JS脚本。
在编码中UTF-8码支持中文（此为最权威，支持中文数量最多的编码方式）
具体样式如下:

<!Doctype html> 声明<html>     <head>        <meta charset="utf-8" />        <title></title>    </head>    <body><input type="password" id="password" name="password" maxlength="10" /> <br/>此处在body的内部写了一个input类型password(passwod为文本单对外显示为点)。 id与name为前后台交互使用的，并不影响显示。    </body></html>

id：唯一标识身份证。
接下来介绍了超链接一的格式如下

<a href="目标路径" target="显示的位置">超链接的对象（例如一串字符一张图）</a>

Target的常用属性如下：
_blank 在新窗口中打开
_self 在自己当前的窗口打开
_parent 在父标签打开
同时介绍了一些常用的格式:

<h1></h1>题头 数字可以从1到6,h1最大h6最小。<b></b>黑体<i></i>斜体<sub></sub>斜向下表示<sup></sup>斜向上表示<u></u>下划线<br/>换行<p></p>定义段落<div align=”midddle”><div>字体居中同样可用font设置字体格式，如下。<font size="5">文字</font>

Table的创建也尤为重要

<table border="1" cellspacing="0" cellpadding="0" width="300px" height="100px" align="center" style="text-align: center;">

Border为边框 cellspacing和cellpadding为与边框的间距。
Width和height为标的宽与高， style（css属性）此处可设置表格中文字样式
Align 可设置表格的位置。

            <tr style="color: purple"> 此处设置行的内容                <th>name</th> 设置列的内,(th表示为标题td表示为内容区别为挺好加粗而td未加粗)                <th>number</th>                <th>age</th>                <th>charecter</th>                <th>sex oreitation</th>            </tr>            <tr>                <td>unkown</td>                <td>unkown</td>                <td>unkown</td>                <td>6</td>                <td>maid</td>            </tr>        </table>

有序列表为 order list

<ol type=”控制排序方式，如数字、字母”start=”控制开始位置（为数字位置）” ><li> </li></ol>

无序列表 unorder list
去别为 type 选择为square，circle等图形。
ol 与ul可相互嵌套。

Frameset    <frameset rows="20%,*" />        <frame src="top.html" name="top" noresize="noresize"/>        <frameset cols="20%,*"/>        <frame src="left.html" name="left" noresize="noresize" />        <frame src="right.html" name="right"/>       </frameset>       <!--应用场景，一般应用在管理系统中        像淘宝电商网站，采用的布局都是div，配合css进行布局       -->

是对界面个是的设置同时iframe也可实现界面格式的设置。
区别：(1)iframe在body中写frameset不能再body中写。
(2)iframe嵌入body中，实现一块区域刷新，frameset页面布局整体框架。
通过今天学的知识完成了如下的一个页面

<!DOCTYPE html><html>    <head>        <meta charset="UTF-8">        <title></title>    </head>    <body>    <center>    </table>    <font size=5> 微博验证 </font></br>    <table border="0" cellspacing="" cellpadding="" style="text-align:  right;">        <tr>            <td>注册邮箱:</td>            <td align="left"><input type="text" name="@" id="@" value="" /></td>        </tr>        <tr>            <td></td>            <td align="middle">你可以<a href="">使用账号</a>或<u>手机号注册</u></td>        </tr>        <tr>            <td>创建密码:</td>            <td align="left"><input type="password" name="" id="" value="" /></td>        </tr>        <tr>            <td>真实姓名:</td>            <td align="left"><input type="text" name="" id="" value="" /></td>        </tr><tr>            <td >性别:</td>            <td align="left"><input type="radio" name="sex" id="sex" value="0" />male     <input type="radio"name="sex" id="sex" value="1"/>female</br></td>        </tr>        <tr>            <td>生日:</td>            <td align="left">                <select name="bir">                <option value="0" selected="selected">2014</option>                </select>    <select name="moth">        <option value="0" >1</option>        <option value="1" selected="selected">2</option>        <option value="2" >3</option>        <option value="3" >4</option>        <option value="4" >5</option>        <option value="5" >6</option>        <option value="6" >7</option>        <option value="7" >8</option>        <option value="8" >9</option>        <option value="9" >10</option>        <option value="10">11</option>        <option value="11">12</option>    </select>    <select name="day">        <option value="0">1</option>    </select>            </td>        </tr>        <tr>            <td>我现在:</td>            <td align="left"><select name="now">        <option value="0">在上学</option>        <option value="1">就业</option>        <option value="2">退休</option>    </select></td>        </tr>        <tr>            <td></td>            <td align="left"><img src="img/验证码.png"></td>        </tr>    <tr>    <td>验证码:</td>    <td align="left"><input type="text" name="yanzheng" id="yanzheng"></td>    </tr>        <tr>            <td></td>            <td align="left"> <a href=""><img src="img/按钮.png"width=""></a></td>        </tr>    </table>    </center>    </body></html>

效果如下
这里写图片描述

阅读全文

0 0