版权声明:本文为博主原创文章,转载请注明出处. https://blog.csdn.net/qq_34548401/article/details/84947938
知识结构
- html
- css
- javaScript
- jQuery
-
网页的组成
- 结构(HTML)
- HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息,可以包含文字、图片、视频等。
- 表现(CSS)
- CSS样式是表现。就像网页的外衣。比如,标题字体、颜色变化,或为标题加入背景图片、边框等。所有这些用来改变内容外观的东西称之为表现。
- 行为
- JavaScript
- JQuery
- 结构(HTML)
-
html文件的结构
- 为HTML页面中的根标签,所有的HTML网页中的标签都在中。
- 标签用于定义文档的头部,它是所有头部元素的容器。头部元素有
<title>、<script>、 <style>、<link>、<meta>、<title>、<script>、 <style>、<link>、<meta>
- 在和标签之间的内容是网页的主要内容,如<h1>、<p>、<a>、<img>等网页内容标签,在这里的标签中的内容会在浏览器中显示出来。
-
标签的语法
- 标签由英文尖括号 < 和 > 括起来,如:
- html中的标签一般都是成对出现的,分开始标签和结束标签。结束标签比开始标签多一个 / ,
… ;还有一些是自结束标签,如: - 标签与标签之间是可以嵌套的,但先后顺序必须保持一致,如:<div>里嵌套<p>,那么<p>必须放在<div>的前面。如: <div><p>…<p><div>
- 注释是不可以嵌套的,如:<!-- <!-- 注释部分 --> -->
- HTML标签不区分大小写,<h1>和<H1>是一样的,但建议小写。
- 标签一般分为有始有终、自结束两类
HTML的常用标签
- 标题标签,div,段落,转义字符,无序列表,图片标签
- 标题标签:<h1>…</h1>~<h6>…</h6>
- div标签:<div>…</div>,相当于一个容器,可以把一些独立的逻辑部分(如网页中独立的栏目版块)划分出来
- 段落标签:<p>…</p>
- 转义字符
- 语法:&;
- eg:
- > 大于号
- < 小于号
- 空格
-   中文空格
- © 版权号
- 无序列表:
<ul>
<li>...</li>
<li>...</li>
</ul>
- 图片标签:
- alt:图片无法显示时显示的描述性文字
- src:图片的地址
- 相对路径
- 绝对路径
- title(了解):鼠标放在图片上时显示的描述性文字
- 超链接:<a href="" target=""></a>
- href:指向一个链接地址
- target:目标窗口
- 值为”_self”时在向当前窗口(默认)打开新的网页
- 值为”_blank”时在新的窗口打开
- 内联框架
<iframe src="" name=""></iframe>
src:一个网页的地址
name: iframe的名字,当<a>标签的target属性值 为iframe的name时,超链接的目标页面会在iframe中打开
- 一些强调标签
- <strong>和<em>标签
- 两者在强调的语气上有区别: <em> 表示强调,<strong> 表示更强烈的强调。并且在浏览器中<em> 默认用 斜体 表示,<strong> 用 粗体 表示。
- <span>标签
- <span>标签是没有语义的,它的作用就是为了设置单独的样式用的。有了它就可以对某段文字里的几个字单独设置样式了。
- <strong>和<em>标签
- talbe标签,制作表格
- border:边框
- tr:行
- td:列(单元格)
- th:特殊的td表示表头
- 跨行,跨列
- colspan:跨行
- rowspan:跨列
- align属性,
- left
- right
- center
- form标签,制作表单,可提交!!!
- name
- method 提交方式
- get
- post
- action form提交到哪里
- input标签配合form使用
- type类型选择器
- text文本框
- password密码框
- reset重置按钮
- submit提交按钮
- radio单选按钮
- checkbox多谢按钮
- type类型选择器
- select标签,制作下拉列表框
- name必须要有!!!否则不能提交,表单提交类似于java的properties
- option配合使用表示列表框