Web前端Day1学习笔记:关键概念与标签解析
64 浏览量
更新于2024-08-03
收藏 7KB MD 举报
"这是一份关于web前端学习的笔记,主要涵盖了HTML基础标签和属性的使用,包括文本格式化、链接、表格、列表、注释以及一些基本样式控制。"
在web前端开发中,HTML(HyperText Markup Language)是构建网页内容的基础语言,它通过各种标签来定义页面结构和样式。这份笔记详细列举了多个常见的HTML标签及其用途:
1. **文本格式化标签**:
- `<strong>`用于字体加粗。
- `<marquee>`实现字体滚动效果,通常用于创建无限循环的滚动文字。
- `<input type="text">`创建普通文本输入框。
- `<input type="password">`创建密码输入框,输入内容以星号或圆点显示。
- `<disabled>`属性用于禁用某个元素,如按钮或输入框。
2. **页面结构标签**:
- `<title>`定义页面的标题,显示在浏览器标签页上。
- `<body>`包含网页的主要内容。
- `<h1>~<h6>`定义标题等级,从一级到六级,级别越高,字体越大。
- `<br>`用于换行。
- `<hr>`插入水平线,常用于分隔内容。
- `<p>`用于创建段落。
- `<em>`和`<i>`用于斜体,`<em>`强调,`<i>`一般用于术语或引用。
- `<u>`、`<ins>`添加下划线,`<ins>`表示插入内容。
- `<sup>`和`<sub>`分别用于上标和下标。
- `<del>`划掉文字,表示删除或修订。
- `<pre>`保留预格式,内容按原样显示,不进行自动换行和缩进。
- `<span>`无语义标签,常用于CSS样式控制。
- `<div>`是一个容器标签,可以包含其他HTML元素,用于布局和组织内容。
3. **链接与导航**:
- `<a href="">`创建超链接,`href`属性指向目标URL。
- `target="_self"`或`_blank`决定链接是在当前窗口打开还是新窗口打开。
- `id`属性用于创建锚点,`<a href="#one">`结合`<div id="one">`实现内部跳转。
4. **列表**:
- `<ol>`创建有序列表,`type`属性可指定数字或字母类型,`start`指定起始值。
- `<ul>`创建无序列表,`type`可设置为`circle`、`disc`或`square`。
- `<li>`定义列表项。
5. **表格**:
- `<table>`定义表格,`<caption>`为表格添加标题。
- `<tr>`定义行,`<td>`定义单元格,`<th>`定义表头单元格。
- `border`设置表格边框宽度,`cellspacing`设置单元格间距,`cellpadding`设置单元格内边距。
- `align`属性用于居中对齐表格内容,`background`和`bgcolor`用于设置表格背景颜色。
6. **其他属性**:
- `class`定义CSS类,可重复使用,用于关联样式。
- `tabindex`设置元素的焦点顺序,影响用户使用键盘导航。
- `rowspan`和`colspan`用于合并表格单元格。
- `id`属性确保每个ID在页面中是唯一的,用于选择器定位。
这些基础知识构成了web前端开发的基础,熟练掌握它们对于创建功能丰富的网页至关重要。通过不断实践和学习,可以进一步了解CSS和JavaScript,从而实现更复杂的网页交互和动态效果。
点击了解资源详情
点击了解资源详情
点击了解资源详情
217 浏览量
113 浏览量
Continue_with
- 粉丝: 22
- 资源: 1
最新资源
- 第3章 ACM算法动态规划1
- 第2章 递归与分治策略
- AES标准(英文版)
- The c programming laugage(K&R)
- UH7843 datasheet
- businessobjects使用手册
- SQLServer2005基础教程
- vs.net中开发brew方法
- 三菱全系列PLC编程手册
- C++ Builder 6 入门教程
- 2009年软件设计师考试大纲软考
- C++语言程序设计第三版答案
- Oracle Form个性化手册
- C++Builder6编程实例精解
- windowsXIP系统下的常用命令
- windows nt/2000 native api reference(Gary Nebbett)