目录
1. HTML文档结构
2. 常用属性
2. html段落标签
2.2 html超链接标签
2.3 html图像标签
2.4 html列表标签
2.5 html div标签
2.6 html表格标签
2.7 html表单标签
3.块级元素和行内元素
3.1 块级元素
3.2 行内元素
HTML文档结构
<!doctype html> <!--html5声明-->
<html> <!--html文件标签-->
<head> <!--html头标签-->
<meta charset="utf-8"> <!--万国码-->
<title>前端学习记录</title> <!--浏览页名称-->
</head> <!--html头结束标签-->
<body> <!--html主干标签-->
</body> <!--html主干结束标签-->
</html> <!--html文件结束标签-->
常用属性
放在body中的部分，显示页面的内容
<p>神奇的小青蛙</p>
<a href="https://www.csdn.net/" target="_blank">CSDN首页</a>
href：链接的网址
target：打开的方式
_blank ：新的空白页
_self：子窗口
<img alt="小青蛙" src="image/03-01.jpg">
alt：图片名称 不显示图像时会显示图像的名称
src：图片路径
<ul>
<li>苹果</li>
<li>香蕉</li>
<li>桃子</li>
</ul>
ul：为无序列表
ol：为有序列表
dl：为定义列表
3种只是在格式上有所不同，常用方式为ul + CSS布局
<div>小青蛙</div>
是一个布局使用的标签，属于块级元素。
<table>
<tr>
<td>姓名</td>
<td>学号</td>
<td>性别</td>
</tr>
<tr>
<td>小青蛙</td>
<td>00001</td>
<td>公</td>
</tr>
</table>
<form>
<input type="text" maxlength="10" value="用户名">
</br>
<input type="password" maxlength="10" value="密码">
<select name="水果" >
<option>苹果</option>
<option>香蕉</option>
<option>菠萝</option>
</select>
</form>
input：输入框。一切输入的部分都可以用它
type：输入的类型，包括text，password，radio，checkbox等等
maxlength：输入的最大长度
value：预显示值
select：选择框。单一选择部分
name：选择框名称
option：选项
块级元素和行内元素
<p>...</p> 段落
<ul>...</ul> 无序列表
<table>...</table> 表格
<form>...</form> 表单
<div>...</div>
<span>...</span> 内容
<a>...</a> 链接
<br> 换行
<img> 图片
块级元素都是新启一行进行排版，行内元素则是在当前行进行排版。
比较好的排版模式是将行内元素放入块级元素进行排版。
扫一扫
4万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
