首页手记 HTML+CSS基础学习笔记

HTML+CSS基础学习笔记

标签：

Html/CSS

Html、CSS、 JavaScript的关系

HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息，可以包含文字、图片、视频等。
CSS样式是表现。就像网页的外衣。比如，标题字体、颜色变化，或为标题加入背景图片、边框等。所有这些用来改变内容外观的东西称之为表现。
JavaScript是用来实现网页上的特效效果。如：鼠标滑过弹出下拉菜单。或鼠标滑过表格的背景颜色改变。还有焦点新闻（新闻图片）的轮换。可以这么理解，有动画的，有交互的一般都是用JavaScript来实现的。
——————————————————————————————————
基本结构
<html>
<head>...</head>
<body>...</body>
</html>

——————————————————————————————————
标签
1.<p>段落文本</p>
要引用的文本不用加双引号，浏览器会对q标签自动添加双引号。
2.<hx>标题文本</hx> (x为1-6，由大到小)
3.<strong>和<em>
<em>的内容在浏览中显示为斜体，<strong>显示为加粗。
<em>、<strong>、<span>这三个标签进行一下总结：
<em>和<strong>标签是为了强调一段话中的关键字时使用，它们的语义是强调。
<span>标签是没有语义的，它的作用就是为了设置单独的样式用的。
4.<blockquote>对长文本的引用，如在文章中引入大段某知名作家的文字，这时需要这个标签。
5.
——————————————————————————————————
1.无序标签(圆点)
<ul>
<li>信息</li>
<li>信息</li>
......
</ul>

2.有序列表
<ol>
<li>信息</li>
<li>信息</li>
......
</ol>
——————————————————————————————————
1.摘要

摘要的内容是不会在浏览器中显示出来的。它的作用是增加表格的可读性(语义化)，使搜索引擎更好的读懂表格内容，还可以使屏幕阅读器更好的帮助特殊用户读取表格内容。
<table summary="表格简介文本">

2.标题
用以描述表格内容，标题的显示位置：表格上方。
<caption>标题文本</caption>
——————————————————————————————————
<a></a>实现超链接
1.target="_blank" 超链接中在新窗口中打开
2.title="鼠标滑过显示的文本"
3.mailto 链接Email地址(如果mailto后面同时有多个参数的话，第一个参数必须以“?”开头，后面的参数每一个都以“&”分隔。)
——————————————————————————————————
<img class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="图片地址" alt="下载失败时的替换文本" title = "提示文本">
1、src：标识图像的位置；
2、alt：指定图像的描述性文本，当图像不可见时（下载不成功时），可看到该属性指定的文本；
3、title：提供在图像可见时对图像的描述(鼠标滑过图片时显示的文本)；
4、图像可以是GIF，PNG，JPEG格式的图像文件。
——————————————————————————————————
表单标签，与用户交互？
表单是可以把浏览者输入的数据传送到服务器端，这样服务器端程序就可以处理表单传过来的数据。

<form method="传送方式" action="服务器文件">
1.<form> ：<form>标签是成对出现的，以<form>开始，以</form>结束。

2.action ：浏览者输入的数据被传送到的地方,比如一个PHP页面(save.php)。

3.method ：数据传送的方式（get/post）。

4.所有表单控件（文本框、文本域、按钮、单选框、复选框等）都必须放在 <form></form> 标签之间（否则用户输入的信息可提交不到服务器上哦！）。

5.method : get是从那个网页获得，post是向那个网页输出
—————————————————————————————————
<form>
<input type="text/password" name="名称" value="文本" />
</form>
1、type：

当type="text"时，输入框为文本输入框;

当type="password"时, 输入框为密码输入框。

2、name：为文本框命名，以备后台程序ASP 、PHP使用。

3、value：为文本输入框设置默认值。(一般起到提示作用)
PS:在表单中键入字母、数字等
——————————————————————————————————
CSS中注释语句：/注释语句/
Html中注释语句：

点击查看更多内容