`

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那样行内实现)

 

分享到:
评论

相关推荐

    html基础学习资料

    这个"html基础学习资料"压缩包提供了对于初学者来说非常宝贵的资源,可以帮助他们快速掌握HTML的基本概念和语法。 首先,`html.chm` 文件可能是一个帮助文档,通常包含详细的信息和例子,指导用户学习HTML的各种...

    HTML基础知识点汇总

    HTML 基础知识点汇总 HTML(Hypertext Markup Language,超文本标记语言)是网页设计的基础语言,它将影像、声音、图片、文字等连接显示出来。HTML 语言使用标记式的指令(Tag),将网页文件组织起来,并由浏览器...

    html基础ppt

    html基础

    html基础教程学习

    html基础教程学习

    HTML基础.ppt

    HTML基础 教大家了解学习HTML的课件

    HTML基础.xmind

    HTML基础.xmind

    HTML 基础总结 (下).xmind

    HTML 基础知识的总结,适合初学者!

    HTML基础系统、详细整理.md

    详细地整理html基础知识,贯穿整个html知识,系统地整理,一目了然。

    学习html基础.zip

    学习html基础学习html基础学习html基础学习html基础学习html基础 学习html基础学习html基础学习html基础学习html基础学习html基础 学习html基础学习html基础学习html基础学习html基础学习html基础 学习html基础学习...

    HTML基础学习.zip

    HTML基础学习HTML基础学习HTML基础学习HTML基础学习 HTML基础学习HTML基础学习HTML基础学习HTML基础学习 HTML基础学习HTML基础学习HTML基础学习HTML基础学习 HTML基础学习HTML基础学习HTML基础学习HTML基础学习 HTML...

    html基础学习例子.part2

    《html网页设计参考手册》示例源代码 也是我的html基础家教课件的示例源代码 分2个压缩包 html基础学习例子.part1 html基础学习例子.part2

    HTML基础.docx

    HTML 基础知识点 HTML 基础知识的学习是网站制作的基础。从学习 HTML 到制作网站,需要哪些工具?浏览器和记事本程序(或类似的简易文本编辑器)便是我们所需的全部工具。 浏览器的选择 在学习 HTML 之前,我们...

    HTML基础学习示例代码.zip

    HTML基础学习示例代码HTML基础学习示例代码HTML基础学习示例代码 HTML基础学习示例代码HTML基础学习示例代码HTML基础学习示例代码 HTML基础学习示例代码HTML基础学习示例代码HTML基础学习示例代码 HTML基础学习示例...

    [HTML]html基础教程 [HTML]html基础教程

    这个压缩包中的"HTML基础教程"显然是为初学者设计的,旨在帮助他们掌握HTML的基本概念和语法,从而能够构建自己的网页。以下是对HTML基础知识的详细讲解: 一、HTML结构 HTML文档由一系列元素组成,每个元素都有...

    html基础ppt下载

    掌握HTML基础知识是创建静态网页的第一步,随着技能的提升,你还可以学习CSS(Cascading Style Sheets)来控制网页的样式,以及JavaScript和服务器端技术来实现更复杂的交互功能。通过不断实践和学习,你可以成为一...

    html基础html基础html基础html基础

    "html基础html基础html基础html基础html基础html基础html基础html基础"这个标题和描述多次重复了"html基础",强调了我们要探讨的核心内容——HTML的基本概念、结构以及常见元素。 在HTML中,我们通过使用各种标签来...

    HTML基础知识讲解!

    HTML 基础知识讲解 HTML 基础知识是网页开发的基础,了解 HTML 基础知识是学习网页开发的必备条件。本文将详细讲解 HTML 基础知识,包括 HTML 标题、HTML 段落、HTML 链接和 HTML 图像等。 HTML 标题 -------- ...

    HTML基础学习中.......zip

    HTML基础学习中......HTML基础学习中...... HTML基础学习中......HTML基础学习中...... HTML基础学习中......HTML基础学习中...... HTML基础学习中......HTML基础学习中...... HTML基础学习中......HTML基础学习中.....

Global site tag (gtag.js) - Google Analytics