1. HTML全称:Hyper Text Markup Language超文本标记语言

         不是编程语言

         HTML使用标记标签来描述网页

2.  HTML标签

        开始标签,结束标签。

          例如:<html>     </html>

3.   HTML页面的例子:

<!DOCTYPE html>
<html>
<head>
<meta charset=’utf-8’>
<title>aaaa<title>
</head>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>

例子解释

    • <html> 与 </html> 之间的文本描述网页
    • <body> 与 </body> 之间的文本是可见的页面内容
    • <h1> 与 </h1> 之间的文本被显示为标题
    • <p> 与 </p> 之间的文本被显示为段落
    1. 自闭合标签和闭合标签        meta就是自闭合标签         大多数都是闭合标签
    2. 常用标签

4.    head标签

里面重要的标签meta和title

meta标签:

<meta charset="UTF-8">   标识字符集
<meta name="Keywords" content="汽车之家"> 网站的关键字
<meta name="descrtion" content="哈哈好"> 网站的描述信息
<meta http-equiv="Refresh" content="10,http://www.baidu.com"> 10秒后跳转到百度
<link rel="icon" href="//www.jd.com/favicon.ico"> 获得京东的小图标

         title标签:

    <title>JD</title>

5.    body标签

标签分类: 块级标签和内联标签

区别:块级标签可以独占一行,可以设置长宽高。

内联标签不能独占一行,不可以设置长宽高。

注意:块级标签只能嵌套块级标签和内联标签   p标签只能嵌套内联标签(特殊)

内联标签只能嵌套内联标签

块级标签:h1 h2 h3 h4 h5 h6 p  div

内联标签b span a img

6.    具体标签

标题  总共就6个
<h1> </h1> <h2> </h2> <h3> </h3> <h4> </h4> <h5> </h5> <h6> </h6>
<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>

段落
<p> </p>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p> 链接
<a href="http://www.w3school.com.cn">This is a link</a>
<href="http://www.sohu.com" target="_blank">点击</a> 打开一个新的窗口 图像
<img src="w3school.jpg" width="104" height="142" /> 空元素(换行)

<br>   旧版本使用这个。

<br />  以后都是使用这个。

水平线

<hr />在HTML页面中创建水平线。

b标签  加粗

注释

<!—- 与 -->

div标签  常用的标签

span标签

7.    HTML属性

属性总是出现在HTML元素的开始标签中。

<a href="http://www.w3school.com.cn">This is a link</a>

链接的地址在href属性中指定。

标题的属性。

<h1 align="center"> 拥有关于对齐方式的附加信息。

主体的属性

<body bgcolor="yellow"> 拥有关于背景颜色的附加信息。

注:属性值永远都在引号内。双引号是最常用的。有时候也用单引号。name='Bill "HelloWorld" Gates'

8.     HTML的style属性

应该避免使用下面这些标签和属性:

标签

描述

<center>

定义居中的内容。

<font> 和 <basefont>

定义 HTML 字体。

<s> 和 <strike>

定义删除线文本

<u>

定义下划线文本

属性

描述

align

定义文本的对齐方式

bgcolor

定义背景颜色

color

定义文本颜色

以上标签和属性都不会再使用。现在都使用style属性了。

      例子一,如下:

<html>
<body style="background-color:yellow">
<h2 style="background-color:red">This is a heading</h2>
<p style="background-color:green">This is a paragraph.</p>
</body>
</html>

定义主体的背景色为黄色

定义标题2的背景为红色

定义段落的背景为绿色

这个替换bgcolor属性。

      例子二,如下:

<html>

<body>

<h1 style="font-family:verdana">A heading</h1>

<p style="font-family:arial;color:red;font-size:20px;">A paragraph.</p>

</body>

</html>

      例子三,如下:

<html>

<body>

<h1 style="text-align:center">This is a heading</h1>

<p>The heading above is aligned to the center of this page.</p>

</body>

</html>
  1. HTML文本格式化

文本格式化标签

标签

描述

<b>

定义粗体文本。

<big>

定义大号字。

<em>

定义着重文字。

<i>

定义斜体字。

<small>

定义小号字。

<strong>

定义加重语气。

<sub>

定义下标字。

<sup>

定义上标字。

<ins>

定义插入字。

<del>

定义删除字。

<s>

不赞成使用。使用 <del> 代替。

<strike>

不赞成使用。使用 <del> 代替。

<u>

不赞成使用。使用样式(style)代替。

“计算机输出”标签

标签

描述

<code>

定义计算机代码。

<kbd>

定义键盘码。

<samp>

定义计算机代码样本。

<tt>

定义打字机代码。

<var>

定义变量。

<pre>

定义预格式文本。

<listing>

不赞成使用。使用 <pre> 代替。

<plaintext>

不赞成使用。使用 <pre> 代替。

<xmp>

不赞成使用。使用 <pre> 代替。

引用、引用和术语定义

标签

描述

<abbr>

定义缩写。

<acronym>

定义首字母缩写。

<address>

定义地址。

<bdo>

定义文字方向。

<blockquote>

定义长的引用。

<q>

定义短的引用语。

<cite>

定义引用、引证。

<dfn>

定义一个定义项目。

  1. HTML的CSS

l  外部样式:需要引入外部的css文件,使用link标签

<head>

<link rel="stylesheet" type="text/css" href="mystyle.css">

</head>

<head>

<link rel="stylesheet" type="text/css" href="/html/csstest1.css" >

</head>

  

l  内部样式    在头部定义css,使用style标签。

<head>

<style type="text/css">

h1 {color: red}

p {color: blue}

</style>

</head>

<body>

<h1>header 1</h1>

<p>A paragraph.</p>

</body>

  

l  内联样式   直接在标签的开始处定义

使用style属性,如下:

<p style="color: red; margin-left: 20px">

This is a paragraph

</p>

  

  1. HTML的链接

超链接可以是一个字,一个词,或者一组词,也可以是一副图像,您可以点击这些内容跳转到新的文档或者当前文档中的某个部门。

l  <a>标签用来创建链接。

使用href:指向另一个文档的链接。

使用name:指向文档内的链接。

<a href=”url”>Link text</a>

url可以为新的文档,也可以是本机文档。

例子:

<a href="http://www.w3school.com.cn/">Visit W3School</a>

l  target属性

<a href="http://www.w3school.com.cn/" target="_blank">Visit W3School!</a>

设定打开一个新的窗口。

l  name属性

首先,我们在 HTML 文档中对锚进行命名(创建一个书签):

<a name="tips">基本的注意事项 - 有用的提示</a>

然后,我们在同一个文档中创建指向该锚的链接:

<a href="#tips">有用的提示</a>

您也可以在其他页面中创建指向该锚的链接:

<a href="http://www.w3school.com.cn/html/html_links.asp#tips">有用的提示</a>

l  发送邮件链接

<html>

<body>

<p>

这是邮件链接:

<a href="mailto:someone@microsoft.com?subject=Hello%20again">发送邮件</a>

</p>

<p>

<b>注意:</b>应该使用 %20 来替换单词之间的空格,这样浏览器就可以正确地显示文本了。

</p>

</body>

</html>

  1. HTML的图像

l  使用<img>标签定义。

语法: <img src=”url”  />

url可以是本机,也可以是其他文档的图片。

例子:

<img src="/i/eg_mouse.jpg" width="128" height="128" />

<img src="http://www.w3school.com.cn/i/w3school_logo_white.gif" />

l  替换文本属性

<img src="boat.gif" alt="Big Boat">

例子:

<img src="boat.gif" alt=”wang”>

  1. HTML的表格

<table border="1">

<tr>

<td>row 1, cell 1</td>

<td>row 1, cell 2</td>

</tr>

<tr>

<td>row 2, cell 1</td>

<td>row 2, cell 2</td>

</tr>

</table>

<table>标签定义表格,border定义边框

<tr>定义行

<td>定义在这一行的单元格

  1. HTML的头部元素

l  <title>

例子:

<title>Title of the document</title>

l  <base>

指定页面上的所有链接都指向指定地址。

例子:

<head>

<base href="http://www.w3school.com.cn/images/" />

<base target="_blank" />

</head>

l  <link>

连接外部样式

l  <style>

与上面的内部样式一样。

l  <meta>

此标签必须在<head>内部。

必须的属性content.

可选的属性http-equiv,name,scheme.

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<meta http-equiv="Content-Language" content="zh-cn" />

  1. HTML的脚本
  2. HTML的列表

无序列表

<ul>

<li>Coffee</li>

<li>Milk</li>

</ul>

有序列表

<ol>

<li>Coffee</li>

<li>Milk</li>

</ol>

Python学习笔记十二的更多相关文章

  1. Python学习笔记(十二)—Python3中pip包管理工具的安装【转】

    本文转载自:https://blog.csdn.net/sinat_14849739/article/details/79101529 版权声明:本文为博主原创文章,未经博主允许不得转载. https ...

  2. python 学习笔记(十二) 文件和序列化

    python 文件读写和序列化学习.## python文件读写`1 打开并且读取文件` f = open('openfile.txt','r') print(f.read()) f.close() ` ...

  3. python 学习笔记十二 html基础(进阶篇)

    HTML 超级文本标记语言是标准通用标记语言下的一个应用,也是一种规范,一种标准,它通过标记符号来标记要显示的网页中的各个部分.网页文件本身 是一种文本文件,通过在文本文件中添加标记符, 可以告诉浏览 ...

  4. python学习笔记(十 二)、操作数据库

    每一种语言都少不了多数据库进行各种操作. python支持多种数据库.有关python支持的数据库清单,请参阅:https://wiki.python.org/moin/DatabaseInterfa ...

  5. python学习笔记十二:类的定义

    demo #!/usr/bin/python class Person: name = 'jim' age = 25 def say(self): print 'My name is ' + self ...

  6. python学习笔记(十二)-网络编程

    本文结束使用 Requests 发送网络请求.requests是一个很实用的Python HTTP客户端库,编写爬虫和测试服务器响应数据时经常会用到.可以说,Requests 完全满足如今网络的需求. ...

  7. python 学习笔记十二 CSS基础(进阶篇)

    1.CSS 简介 CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素 样式通常存储在样式表中 把样式添加到 HTML 4.0 中,是为了解决内容与 ...

  8. python3.4学习笔记(十二) python正则表达式的使用,使用pyspider匹配输出带.html结尾的URL

    python3.4学习笔记(十二) python正则表达式的使用,使用pyspider匹配输出带.html结尾的URL实战例子:使用pyspider匹配输出带.html结尾的URL:@config(a ...

  9. Go语言学习笔记十二: 范围(Range)

    Go语言学习笔记十二: 范围(Range) rang这个关键字主要用来遍历数组,切片,通道或Map.在数组和切片中返回索引值,在Map中返回key. 这个特别像python的方式.不过写法上比较怪异使 ...

随机推荐

  1. linux shell通配符及if语句判断

    $# 是传给脚本的参数个数 $0 是脚本本身的名字$1 是传递给该shell脚本的第一个参数$2 是传递给该shell脚本的第二个参数$@ 是传给脚本的所有参数的列表$* 是以一个单字符串显示所有向脚 ...

  2. 在linux服务器上搭建nvidia-docker环境

    docker相当于一个容器,其可以根据你所需要的运行环境构建相应的运行环境,此时各个环境之间彼此隔离,就不会存在在需要跑一个新的代码的时候破坏原来跑的代码所需要的环境,各个环境之间彼此隔离开,好像一个 ...

  3. redis5.0.3单实例简单安装记录

    redis5.0.3单实例简单安装记录 日常需要测试使用,索性记录下来,免得临时又麻烦的找资料. yum -y install make gcc-c++ cmake bison-devel ncurs ...

  4. html5+hbuilder+夜神模拟器+webview

    HTML5 Plus应用概述 首先新建一个移动App项目,文件-->新建-->移动APP HTML5 Plus移动App,简称5+App,是一种基于HTML.JS.CSS编写的运行于手机端 ...

  5. Python高级笔记(一) -- GIL (全局解释器锁)

    1. GIL概念 (cpython历史遗留问题) 概念? 对Python多线程的影响? 编写一个多线程抓取网页的程序? 阐述多线程抓取程序是否比单线程性能有提升, 并解释原因. GIL:全局解释器锁, ...

  6. 模仿OpenStack写自己的RPC

    在openstack中使用两种通信方式,一种是Restful API,另一种是远程过程调用RPC.本片文章主要讲解openstack中RPC的使用方式,以及如何在我们自己的架构中使用RPC. 在我前面 ...

  7. node服务端口被占用Error listen EADDRINUSE :::3000

    Error: listen EADDRINUSE: address already in use :::3000,出现这个报错说明3000端口被占用 解决方法:找到占用该端口的程序,kill杀掉它就可 ...

  8. css 修改placeholder的颜色

    input::-webkit-input-placeholder { color: #ff0000; } input::-moz-input-placeholder { color: #ff0000; ...

  9. 普通用户授予select any table 权限

    基于应用的需要,让普通用户有访问sys表的权限,于是就想到了select any table 的权限,可是当授权以后发现还是不能访问sys的表,经过查一系列资料,发现select any table不 ...

  10. Mac环境下Vagrant的安装

    1.安装Vagrant 下载地址:https://www.vagrantup.com/downloads.html 下载好pkg包后,点击安装即可. 2.安装 VirtualBox 下载地址:http ...