Web前端基础(2):HTML(二)
1. body中的相关标签
1.1 标题标签：hn
HTML提供<hn>系列标签，用于修饰标签，包含：<h1>、<h2>、<h3>、<h4>、<h5>、<h6>。<h1>定义最大的标题。<h6>定义最小的标题。
例如：
<html>
<head>
<meta charset="utf-8"/>
<title></title>
</head>
<body>
<!-- 标题标签 -->
<h1>小灰灰</h1>
<h2>小灰灰</h2>
</body>
</html>
1.2 水平线标签：hr
<hr/>：标签在HTML页面中创建一条水平分隔线，用于 定义内容中的主体变化。
size属性：水平线的高度，单位像素。
noshade属性：没有阴影，取值，noshade，表示显示纯色。
例如：
<html>
<head>
<meta charset="utf-8"/>
<title></title>
</head>
<body>
<!-- 水平线 -->
<hr />
<hr size="5" />
<hr noshade="noshade" />
</body>
</html>
1.3 字体标签：font
<font>：用于设置字体尺寸、字体颜色等。
size属性：设置字体的大小。可能的值：从1到7的数字。浏览器默认值是3。
color属性：设置字体的颜色。
颜色的取值：#xxxxxx或colorname
#xxxxxx表示使用红绿蓝三原色设置颜色。
红绿蓝分别取值：00--ff，此处使用16进制。(ff就是十进制的255)
#000000 黑色，#ffffff 白色
#ff0000 红色，#00ff00 绿色，#0000ff蓝色
红绿蓝2位取值相同可以省略成1位。例如：#112233简化成#123
colorname使用英文单词确定颜色。red红色，blue蓝色，green绿色
例如：
<html>
<head>
<meta charset="utf-8"/>
<title></title>
</head>
<body>
<!-- 字体-->
<font size="7">我最大</font>
<font color="#ff0000">我最红</font>
<font color="blue">我最蓝</font>
</body>
</html>
1.4 格式化标签：b、i
<b>：粗体。
<i>：斜体。
例如：
<html>
<head>
<meta charset="utf-8"/>
<title></title>
</head>
<body>
<!-- 格式化-->
<b>粗体</b>
<i>斜体</i>
</body>
</html>
1.5 段落标签：p、br
<p>：定义段落。p标签会自动在其前后创建一些空白。
<br/>：插入单个换行。
例如：
<html>
<head>
<meta charset="utf-8"/>
<title></title>
</head>
<body>
<!-- 段落-->
<p>我是段落1</p>
<br />
<p>我是段落2</p>
</body>
</html>
1.6 图片标签：img
<img>：在html页面中引用一张图片。
src：指定需要显示图片的URL（路径）。
alt：图片无法显示时的替代文本。
width：设置图像的宽度。
height：定义图像的高度。
实例：
<html>
<head>
<meta charset="utf-8"/>
<title></title>
</head>
<body>
<!-- 显示图片 -->
<img src="img/1.jpg" alt="我躲起来了" width="200px" height="200px" title="鼠标移上显示"/>
<img src="img/0.jpg" alt="我躲起来了" width="200px" height="200px" title="鼠标移上显示"/>
</body>
</html>
1.7 列表标签：ul、ol
<ol>：定义有序列表。
type：列表类型，取值：A、a、I、i、1等。
<ul>：定义无序列表。
type：符号的类型，取值：disc 实心圆、square 方块、circle 空心圆。
<li>：定义列表项。是<ul>或<ol>的子标签。
例如：
<html>
<head>
<meta charset="utf-8"/>
<title></title>
</head>
<body>
<!-- 列表标签 -->
<ul type="circle"> <!-- 以“空心圆”显示无序列表 -->
<li>无序</li>
<li>无序</li>
<li>无序</li>
</ul> <ol type="I"> <!-- 以大写阿拉伯数字显示序号 -->
<li>有序</li>
<li>有序</li>
<li>有序</li>
</ol>
</body>
</html>
1.8 超链接标签：a
<a>：标签是超链接，是在html页面提供一种可以访问其他位置的实现方式。
href：用于确定需要显示页面的路径（URL）。
target：确定以何种方式打开href所设置的页面。常用取值：_blank、_self等。
_blank：在新窗口中打开href确定的页面。
_self：默认。使用href确定的页面替换当前页面。
例如：
<html>
<head>
<meta charset="utf-8"/>
<title></title>
</head>
<body>
<!-- 超链接 -->
<a href="http://www.baidu.com" target="_self">
访问百度，以默认方式打开
</a><br />
<a href="http://www.cnblogs.com" target="_blank">
访问博客园，以新窗口方式打开
</a><br />
</body>
</html>
Web前端基础(2):HTML(二)的更多相关文章
- Web前端基础(5):CSS(二)
1. 盒模型 在CSS中,"box model"这一术语是用来设计和布局时使用,然后在网页中基本上都会显示一些方方正正的盒子.我们称为这种盒子叫盒模型. 盒模型有两种:标准模型和I ...
- web前端基础知识-（二）CSS基本操作
1. 概述 css是英文Cascading Style Sheets的缩写,称为层叠样式表,用于对页面进行美化. 存在方式有三种:元素内联.页面嵌入和外部引入,比较三种方式的优缺点. 语法:style ...
- Web前端基础——jQuery（二）
一.jQuery 中的常用函数 1) $.map(Array,fn); 对数组中的每个元素,都用fn进行处理,fn将处理后的结果返回,最后得到一个数组 //因为这些操作,没有与dom元素相关的,所以可 ...
- Web前端基础(8):JavaScript(二)
1. 数据类型转换 1.1 将数值类型转换成字符串类型 1.1.1 隐式转换 在js中,当运算符在运算时,如果两边数据不统一,CPU就无法计算,这时我们编译器会自动将运算符两边的数据做一个数据类型转换 ...
- web前端基础知识及快速入门指南
web前端基础知识及快速入门指南 做前端开发有几个月了,虽然说是几个月,但是中间断断续续的上课.考试以及其它杂七杂八的事情,到现在居然一直感觉自己虽然很多前端的知识很眼熟,却也感觉自己貌似也知识在门口 ...
- 进击的Python【第十六章】：Web前端基础之jQuery
进击的Python[第十六章]:Web前端基础之jQuery 一.什么是 jQuery ? jQuery是一个JavaScript函数库. jQuery是一个轻量级的"写的少,做的多&quo ...
- 进击的Python【第十五章】：Web前端基础之DOM
进击的Python[第十五章]:Web前端基础之DOM 简介:文档对象模型(Document Object Model,DOM)是一种用于HTML和XML文档的编程接口.它给文档提供了一种结构化的表示 ...
- 进击的Python【第十四章】：Web前端基础之Javascript
进击的Python[第十四章]:Web前端基础之Javascript 一.javascript是什么 JavaScript 是一种轻量级的编程语言. JavaScript 是可插入 HTML 页面的编 ...
- 进击的Python【第十三章】：Web前端基础之HTML与CSS样式
进击的Python[第十四章]:Web前端基础之HTML与CSS样式 一.web框架的本质 众所周知,对于所有的Web应用,本质上其实就是一个socket服务端,用户的浏览器其实就是一个socket客 ...
随机推荐
- Web安全测试学习笔记 - DVWA+PHP环境搭建
DVWA(Damn Vulnerable Web Application),是一个用PHP编写的,作为Web安全测试练习平台的合法环境(毕竟咱不能为了练习就随便找个网站去攻击...),也就是俗称的靶场 ...
- HelloDjango 第 11 篇：自动生成文章摘要
作者:HelloGitHub-追梦人物 文中涉及的示例代码,已同步更新到 HelloGitHub-Team 仓库 博客文章的模型有一个 excerpt 字段,这个字段用于存储文章的摘要.目前为止,还只 ...
- React躬行记（1）——函数式编程
函数式编程是React的精髓,在正式讲解React之前,有必要先了解一下函数式编程,有助于更好的理解React的特点.函数式编程(Functional Programming)不是一种新的框架或工具, ...
- sql server 2014 卸载
遇到一个沙雕工程人员~二话不装给我装了2014的版本,实际开发的时候用的是2012....欸~ 1.打开服务 2.打开控制面板下的程序与功能 3选中红框点击卸载与更改----->选择删除 4.然 ...
- ASP.NET Core部署系列二：发布到CentOS上
前言: 在上一节中,通过一系列的步骤,已经将项目部署到IIS上,虽然遇到了一些问题,但最终解决并成功运行了.而在这一节中,将尝试通过linux系统的环境下,部署项目,实现Net Core跨平台的亮点. ...
- ASP.NET Core Web 应用程序系列（一）- 使用ASP.NET Core内置的IoC容器DI进行批量依赖注入（MVC当中应用）
在正式进入主题之前我们来看下几个概念: 一.依赖倒置 依赖倒置是编程五大原则之一,即: 1.上层模块不应该依赖于下层模块,它们共同依赖于一个抽象. 2.抽象不能依赖于具体,具体依赖于抽象. 其中上层就 ...
- 11.JavaCC官方入门指南-例6
例6:计算器--添加括号.一元运算符和历史记录 1.calculator3.jj 我们只需要再添加一些特色,就可以得到一个可用的四则运算计算器.在这一版的修改中 ,我们将使得程序可以接收括号.负值 ...
- git submodule git 子模块管理相关操作
Git 子模块操作相关的一些命令备忘: # 当使用git clone下来的工程中带有submodule时,初始的时候 submodule的内容并不会自动下载下来的,需执行如下命令: git submo ...
- Octave中的一些常用操作
>> 5+6ans = 11>> 1~=2ans = 1 %1表示true,0表示false>> 1~=1 %1不等于1ans = 0>> a=2 ...
- 3-3 用户管理-新建用户useradd和passwd
3.用户管理 终端命令 提示:创建用户/删除用户/修改其他用户密码的终端命令都需要通过sudo执行 3.1创建用户/修改密码/删除用户 序号 命令 作用 说明 01 useradd -m -g 组 新 ...