Html 基础

一、字符编码
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">/
字符集编码:
gb312:简体中文,一般用于包含中文和英文的页面、
ISO-885901: 纯英文,一般用于只包含英文的页面
big5:繁体,一般用于带繁体字的页面
utf-8:国际性通用字符编码,同样适用于中文和英文的页面。和gb2312编码相比,国际通用性更好。但字符编码的压缩比稍低,对网页有一定影响。

二、标签
<h1>-<h6> h1字号最大,h6字号最小
<p></p> 段落标签
<br/> 换行标签
<hr/> 水平线标签
<strong></strong> 加粗
<em></em> 斜体

三、超链接
<a href="login/login.html">登录</a>
表示链接地址为当前页面所在路径"login"目录下的"login.html"页面。比如当前页面在D:\root,则链接页面为D:\root\login\login.htm
另外../及../表示当前目录的上级目录以及当前目录的上上级目录。


四、列表
无序列表:(显示项前为圆点)
<ul>
  <li>橘子</li>
  <li>苹果</li>
  <li>香蕉</li>
</ul>
有序列表: (显示项前为数字之类)
<ul>
  <li>橘子</li>
  <li>苹果</li>
  <li>香蕉</li>
</ul>
定义列表(dl为列表开始 dt为每个列表项的开始,dd为列表项的定义)
<dl>
  <dt>所属学院</dt>
  <dd>计算机应用</dd>
  <dt>所属专也</dt>
  <dd>计算机软件工程</dd>
</dl>

五、表格

跨行:rowspan
跨列:colspan

六、表单
<input > type为元素类型,value在text等文本框为文本内容,单选、复选框为后台传值, 按钮类型 value为按钮上显示的文字


radio单选框,单选按钮用于一组相互斥的值,组中的每个单项按钮应具有相同的name,同时需要一个value. 可以使用checked属性。
<input name = "gen" type="radio" value="男" checked="checked">男
<input name = "gen" type="radio" value="女">女

复选框
<input name = "checkbox" name="interest" value="sports">运动
<input name = "checkbox" name="interest" value="talks">聊天
<input name = "checkbox" name="interest" value="play">玩游戏

列表框
<select name="bmon">
  <option value="">请选择月份</option>
  <option value="1">一月</option>
  <option value="2">二月</option>
  <option value="3">三月</option>
  <option value="4">四月</option>
</select>

按钮
reset: 表单中各个元素被重置为最初状态
submit:提交到action所指定的URL
button:普通按钮,通常绑定onclick事件。

文本域:
<textarea cols="显示列的宽度" rows="显示的行数"></textarea>

隐藏域:
<input type="hidden" value="666" name="userid">

readonly、disabled属性
Readonly只针对input(text / password)和textarea有效,而disabled对于所有的表单元素都有效,包括select, radio, checkbox, button等。

但是表单元素在使用了disabled后,当我们将表单以POST或GET的方式提交的话,这个元素的值不会被传递出去,
而readonly会将该值传递出去(这种情况出现在我们将某个表单中的textarea元素设置为disabled或readonly,但是submit button却是可以使用的)。
文本框设置为readonly:
<input name="name" type="text" value="张三" readonly="readonly">

按钮设置为disabled
<input type="submit" value="修改" disabled="disabled">

七、语义化表单
使结构合理、代码简洁
7.1
<table>
  <caption>岗位信息表</caption>
  <thead>
    <tr>
       <th>姓名</th>
       <th>职务</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td align="center">张三</td>
      <td align="center">技术员</td>
    </tr>
  </tbody>
</table>

显示如下,姓名和职位两列为加粗
   岗位信息表
姓名     职务
张三     技术员

7.2
<form>
<fieldset>
  <legend>用户信息</legend>
  姓名:<nput type="text">
  年龄:<nput type="text">
  ...
</fieldset>
</form>

八、div标签 span标签
DIV标签用于将HTML文档分成独立、不同部分.HTML <div>  定义文档中的分区或节(division/section),是块级元素,它是可用于组合其他 HTML 元素的容器。
如果与 CSS 一同使用,<div> 元素可用于对大的内容块设置样式属性。
<div> 元素的另一个常见的用途是文档布局。它取代了使用表格定义布局的老式方法。
使用 <table> 元素进行文档布局不是表格的正确用法,<table> 元素的作用是显示表格化的数据。
<div></div>

SPAN标签被用来组合HTML文档内的行内元素的。它没有固定的格式表示,也没有特定的含义。只有对它应用CSS样式,它才会产生视觉上的变化。
<p>享受<span class="show">"北大式"</span></p>


九、display属性

none : 该元素不会被显示
block: 块级元素的默认值,元素会被显示为块级元素,该元素前后有换行符(与div标签那样块状显示)
inline:内联元素的默认值,元素会被显示为内联元素,该元素前后没有换行符(与span那样行内实现)

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值