HTML5教程

HTML学习

本文主要是介绍HTML学习，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

声明：老规矩,不完整，就是学了做着玩玩的

1.基础模板

<!DOCTYPE HTML>           //声明html语言和版本
<html> 

  <!--头部-->
  <head>                    
    <meta charset="utf-8">    
    <tittle>这是一个标题</tittle>  
  </head>

  <!--内容-->
  <body>
      <h1>第1级标题（共可设6级标题）</h1>
      <p>段落</p>
        <!--这是一个链接-->
        <a href = "www.baidu.com">这是一个链接</a>
        <!--这是一张图片-->
        <img ……>
  </body>

</html>

2.一些知识点（不重要）

  • 换行：<br/>
换行与段落的区别，段落会产生一段额外的垂直距离
<br/>中的/表示自封
  • 水平线：<hr/>

3.文本格式化（不重要）

加粗：<b> 斜体：<i>
电脑自动输出：<code>(代码)</code>
上标：sup 和 下标：sub

4.链接

  • HTML使用<a>中的href属性来添加链接,即:
<a href="url">链接文本</a>
<!--子文件夹最好加上/，否则访问时会自动加上/,致使产生两次请求-->

(？但是只打开了一个页面？)

  • 定义id
    <a id="……">文本</a>
    类似类的调用，里边内容填前面定义好的类名,
    类名被id调用后，不能再被调用.
    当多个定义语句同时出现时，权重：
    inline(不引用，直接写)>id>class>type(整体一起定义的,如定义4级标题是蓝色)

5.<head>头部标签

<head> 元素包含了所有的头部标签元素。在 <head>元素中你可以插入脚本（scripts）, 样式文件（CSS），及各种meta信息。

可以添加在头部区域的元素标签为:<title>, <style>, <meta>, <link>, <script>, <noscript> 和 <base>

  • <tittle>:<tittle>抬头名</tittle>
    即抬头，这个页面的名字。
  • <base>:< href="url" target="_blank">
    设置默认的地址链接,后半部分表示链接会在一个新页面打开。

6.列表和表格

  • 无序列表
<ul>
  <li>列表项1</li>
  <li>列表项2</li>
</ul>
  • 有序列表
<ol>
  <li>有序列表1</li>
  <li>有序列表2</li>
</ol>
  • 表格
    table分为标题和内容
<table>

  <thead>
    <tr>
      <th>号码</th>
    </tr>
  </thead>

  <tbody>
    <tr>
      <th>123</th>
    </tr>
  </body>

</table>

结果如下：

号码
123

7.表单

外格式需要用:
<form>……</form>嵌套

<!--小框-->
<label>标签1</label>
<input type="text">
或者
<!--大框-->
<label>标签2</label>
<textarea></textarea>
或者
<!--选择框-->
<label>性别</label>
 <option value="male">男</option>
 <option value="female">女</option>
 <option value="other">其他<option>

结果如下：




(选择项无法正常显示)

  • 表单默认为横排列，若是向竖着排列，可在外加：
    <div>……</div>

8.按钮和图片

<button>这是一个按钮</button>

结果如下：

<img src="url" alt="这是一张图片" width="100" height="100">

示例如下：
九龄~~~~
(应该加载不出来，出来了就

这篇关于HTML学习的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！
您可能喜欢
栏目导航