Html基础

HTML基础

标签

html是由不同的标签构成的

文件的基本结构

Html基础_第1张图片

上面是代码的基本结构不需要慎重的思考!

使用F12进入Elements,可以看到元素相关的内容!具体的代码实现的相关内容。

整体的Html直接构成一个DOM树的结构。

常见的标签

注释的代码


标题标签

<h1>h1>
<h2>h2>

段落标签

<p>p>

换行

<br>

不需要结束标签

加粗

<strong>strong>

倾斜

<em>em>

下划线

<i>i>

图片标签

<img src= "路径" alt = "" title = "提示文本" width height>

路径分为直接路径,间接路径,网络路径

这里是属于img标签之中的其他属性的东西。

alt提示文本,如果图片显示错误,会出现相应的文字。

title:把鼠标放在对应位置然后映照出相应的信息。

width, height对于图片尺寸控制

超链接标签

<a href = "url" ><h1><h1>a>

url为网站地址,也可以是一个文件

中间可以夹上其他标签

表格标签

<table >
  
table>

align 是表格相对于周围元素的对齐方式. align=“center” (不是内部元素的对齐方式)

border 表示边框. 1 表示有边框(数字越大, 边框越粗), “” 表示没边框.

cellpadding: 内容距离边框的距离, 默认 1 像素

cellspacing: 单元格之间的距离. 默认为 2 像素

width / height: 设置尺寸.

这些都可以进行控制表的属性

列表标签

布局展现

<ul>ul>
<li>li>
<dl>dl>

会基本掌握相关的东西

表单标签

form标签

<form action = "">form>

后面来讨论

input标签(用于基本的文本框)

用于输入数等信息

<input type = "类型" value = "语句" onclick = "">

可以选择输入的类型(text文本框),(password密码框)

type可以选择button value = “”,这里可以使用按钮的内容,点击之后就会触动相应的的反应onclick = ""这里可以放相应的函数 (用JavaScript进行处理)

   <input type="submit" value="提交">form>

这里是提交的按钮

type选择file就可以进行文档的上传操作

<input type = "file">

label相应标签

Html基础_第2张图片

select标签

<select>
  <option>option>
  <option>option>
	<option>option>
select>

中间可以加上相应选项的内容。option之中天津selected = "selected"就可以作为默认选项。

网页盒子布局标签

<div>
  
div>

独占一行的,是一个大盒子

<span>span>

是一个小盒子

总结

Html就是整个前端的框架

你可能感兴趣的:(html,前端)