前端学习:html基础学习一
1、HTML的语法（主要内容HTML语法格式、文档注释、代码格式）
HTML的特点
1.可以设置文本的格式，比如标题、字号、文本颜色、段落等等
2.可以创建列表（例如打开百度，我们可以看到这样的列表)
3.可以插入图像和媒体(例如百度首页我们也可以看到图片）
4.可以建立表格
5.超链接，可以使用鼠标点击超链接来实现页面之间的跳转
HTML的标记和他的属性
HTML文档的保存格式
.html
.htm
.xhtml
标记和被标记的内容构建出HTML文档
格式
<标记>
内容
</标记>
例：打开开发工具Notepad++，写下代码：
<html>
<body>
Hello
</body>
</html>
保存，新建一个文件夹，命名为“课程源文件”，打开文件夹“课程源文件”，新建一个文件夹，命名为“第一节课”，然后保存，保存的类型选择，如图：
然后我们打开“课程源文件”，接着打开“第一节课”，里边有我们刚才新建的内容，将其拖到浏览器中，浏览器中就会显示我们刚才新建的内容，“Hello”。
需要注意，标记是成对出现
标记的属性
标记的属性，就是用来控制我们的内容（图像、文本等的）如何的显示，格式如下：
<标记 属性1=属性值 属性2=属性值 ... ... >内容</标记>
例如<body bgcolor="red">内容</body>
以上的属性是用来控制我们的网页的背景颜色，bgcolor 就是body的属性，他的值是red（红色）
<html>
<body bgcolor=”red”>
MAIZI
</body>
</html>
当我们刷新之后，整个网页背景就会变成红色：
语法不区分字母大小写
<HTML>、<Html>、<html>都是定义相同的标记，但是在编写网页的时候尽量使用小写
文档注释
注释一段内容时使用“<!--”开始，以"-->"结束，例如<!--我是这个网页的作者，我的名字叫做朱朝兵-->
注释的内容不会显示！！！！！！
字符实体
什么是字符实体？
比如我们想在网页上面显示一个“<”小于符号，但是“<”在HTML中是文档标记的开始语言，如果我们直接使用“<”会出差错，所以我们就会一些实体名称来代替！
常见的字符实体
显示结果----------描述----------实体名称----------实体编号
---------------------空格---------- ----------
<--------------------小于号---------- <---------- <
>--------------------大于号---------- >---------- >
&--------------------和号---------- &---------- &
"--------------------引号---------- " ---------- "
'--------------------撇号---------- ' (IE不支持)---------- '
￠--------------------分---------- ¢---------- ¢
£--------------------镑---------- £---------- £
¥--------------------日圆---------- ¥---------- ¥
€--------------------欧元---------- €---------- €
§--------------------小节---------- §---------- §
©--------------------版权----------©---------- ©
®--------------------注册商标---------- ®---------- ®
™--------------------商标---------- ™---------- ™
×--------------------乘号---------- ×---------- ×
÷--------------------除号---------- ÷---------- ÷
2、HTML的基本机构（主要内容标记<html><head><title><body>）
<html>内容</html>
解释：HTML文档的文档标记，也称为HTML开始标记
功能: 这对标记分别位于网页的最前端和最后端
<html>在最前端表示网页的开始
</html>在最后端表示网页的结束
<head>内容</head>
解释：HTML文件头标记，也称为HTML头信息开始标记
功能：用来包含文件的基本信息，比如网页的标题、关键字，在 <head></head>内可以放<title></title>、<meta></meta>、 <style></style>等等标记
注意:在<head></head>标记内的内容不会在浏览器中显示
<title>内容</title>
解释：HTML文件标题标记
功能：网页的“主题”，显示在浏览器的窗口的左上边
注意：网页的标题不能太长，要短小精悍，能具体反应页面的内 容，<title></title>标记中不能包含其他标记
<body>内容</body>
解释：HTML文档的主体标记
功能：<body>...</body>是网页的主体部分，在此标记之间可以包 含如<p></p>、<h1></h1>、<br>、<hr>等等标记，正是由 这些内容组成了我们所看见的网页
body标记的常见属性：
1.bgcolor
设置背景颜色
<body bgcolor="red"></body>
2.text
设置文本颜色
<body text="green"></body>
3.link
设置连接颜色
<body link="blue"></body>
4.vlink
已经访问了的链接颜色
<body vlink="yellow"></body>
5.alink
正在被点击的链接颜色
<body alink="red"></body>
<meta>内容</meta>
解释：页面的元信息（meta-information）
功能：提供有关页面的元信息（meta-information），比如针对搜索引擎和更新频度的描述和关键词。
必须的属性：
content
值：some_text
定义与 http-equiv 或 name 属性相关的元信息
常见的属性：
1.常用的name属性：
1.author
2.keywords
3.description
6.others
把 content 属性关联到一个名称：比如描绘出网页的关键词：<meta name="keywords" content="html学习之html结构">
注意：meta标记必须放在head元素里面
前端学习:html基础学习一的更多相关文章
- vagrant的学习 之 基础学习
vagrant的学习 之 基础学习 本文根据慕课网的视频教程练习,感谢慕课网! 慕课的参考文档地址:https://github.com/apanly/mooc/tree/master/vagrant ...
- JsRender 前端渲染模板基础学习
JsRender前端渲染模板 使用模板,可以预先自定义一些固定格式的HTML标签,在需要显示数据时,再传入真实数据组装并展示在Web页中:避免了在JS中通过“+”等手动分割.连接字符串的复杂过程:针对 ...
- web前端——Vue.js基础学习
近期项目的前端页面准备引入Vue.js,看了网上一些简介,及它和JQuery的对比,发现对于新入门的前端开发来说,Vue 其实也是比较适用的一个框架,其实用性不比JQuery差,感觉还挺有意思,于是研 ...
- 前端学习:html基础学习五
9.HTML表单设计(主要内容<form><input><select>标记) 表单标记 <form>...</form> <form ...
- 前端学习:html基础学习四
7.HTML表格(主要内容<table><caption><tr><th><td>标记) <table>标记 基本格式 < ...
- 前端学习:html基础学习三
5.图像标记(主要内容<img>标记) <img>标记的使用方法 <img src="路径/文件名.图片格式" width="属性值&quo ...
- 前端学习:html基础学习二
3.文档设置标记上-格式标记(主要内容标记<br><p><center><pre><li><ul><ol><d ...
- web前端——Vue.js基础学习之class与样式绑定
打着巩固 css 知识的旗号开始了对 vue 样式绑定的研究,相比前一篇的 demo,本次内容多了各种样式在里面,变得稍微花哨了些,话不多说,直接上代码吧: <html> <head ...
- [AngularJS学习笔记] 基础学习01
2016-06-06开始学习AngularJS AngularJS是会extend HTML的 ng-directives 先学习了四个 ng-app:定义AngularJS Application的 ...
随机推荐
- 三、spring cloud 服务提供与调用
如何使用eureka服务注册中心,搭建一个简单的服务端注册服务,客户端去调用服务使用. 案例中有三个角色:服务注册中心.服务提供者.服务消费者,eureka单机版启动既可,流程是首先启动注册中心,服务 ...
- 什么是PMI
项目管理协会 PMI PMI是世界领先的非盈利会员协会的项目管理专业机构 ,在全球185个国家有70多万会员和证书持有人.此外,PMI还是多个英文短语的缩写,较为著名的是采购经理指数PMI. 项目管理 ...
- linux系统安全及应用
小伙伴们让我们一起回顾一下Linux系统安全基础知识吧 1. 系统账号清理 对于公司里刚离职或停职不久的人,处于公司信息安全考虑,给他们的账号给锁定就好了. usermod -L wangqingxi ...
- spring mvc对静态资源的访问
如果我们的项目使用的是springmvc,在web.xml中会有一段这的配置. <servlet> <servlet-name>springMvc</servlet-na ...
- 【转载】JAVA中综合接口和抽象类实现的一种“抽象接口”
Muscleape个人总结:(这里的抽象接口是指:使用一个抽象类实现一个接口,是两部分结构) 使用一个抽象类直接实现接口,将接口中的方法区分为实现类必须要实现的和选择性实现的,其他需要实现接口的类型通 ...
- mongodb设置用户名和密码
需求:我们需要在一个mongodb上面新建两个数据库,每个数据库的用户名和密码不一样,讲道理来说我们直接设置admin,就可以控制所有的数据库,不过用起来总是感觉有各种问题,目前还不太熟悉mongod ...
- SUID、SGID、Sticky BIT
添加SUID: chmod 4755 可执行文件名 或 chmod u+s 可执行文件名 删除SUID: chmod 755 可执行文件名 或 chmod u-s 可执行文件名 [root@local ...
- windows环境下mysql主从配置
mysql主从配置. 相关理论知识可以百度一下,这里就不多说了,直接说如何配置. 一.环境介绍及说明 主库所在的操作系统:win7 主库的版本:mysql-5.6.24-winx64.zip 主库的i ...
- Swift 开源项目练习应用
小的View.动画实现练习 拥有着苹果先天生态优势的Swift自发布以来,各种优秀的开源项目便层出不穷.本文作者站在个人的角度,将2014年Swift开源项目做了一个甄别.筛选,从工具.存储.网络.界 ...
- Jenkins 关闭和重启实现方式.
1.关闭Jenkins 只需要在访问jenkins服务器的网址url地址后加上exit.例如我jenkins的地址http://localhost:8080/,那么我只需要在浏览器地址栏上敲下http ...