一、HTML  网站(站点),网页基础知识

HTML是一门编程语言的名字:超文本标记语言

可以理解为:超越了文本的范畴,可以有图片、视频、音频、动画特效等其他内容,用标记的方法进行编程的计算机语言

基本格式:

<html>

<title>标题名称</title>

<head>

网页渲染,特效

</head>

<body>

网页内容

</body>

</html>

二、标记

添加注释:<!--注释内容-->

1.文字标记

文字加粗:<b>文字</b>   或  <strong>文字<strong>

文字倾斜:<i>文字</i>

文字下划线:<u>文字</u>

文字颜色,字号,字体:<font color=""  size=""  face="">文字</font>

color可以为颜色的英文名称,也可以为色号,即#+(A-F)之间任意3个字母      (http://tool.oschina.net/commons?type=3)

size=1-7其中一个数字   1最小,7最大

face直接写字体的中文名称即可

2.图片标记

<img src="图片路径" width="宽度" height="高度" title="标签" alt="文字">   (图片最好和HTML文件放在一个同一个文件夹,方便操作)   ../  向上一层

title是图片标签,显示效果:将鼠标放置到图片上会显示该图片对应的标签的内容

高跟宽设置一个即可,显示图片会按比例缩放

alt在图片无法加载时,显示文字,还可帮助搜索引擎搜索

宽度和高度可以为数值,也可以为%,width=100%即为将图片左右平铺,height=100%即为将图片上下平铺

3、常用标记

&nbsp;   --空格

<br/>    --换行

<p>段落<p>      --段落上下会各空一行

<h1>内容</h1>~<h6></h6>          --标题标记

<div>内容</div>          --层标签(默认占一行)

<ol type="1"或"a"或"i">                   --有序列表

<li>序号1</li>

<li>序号2</li>

<li>序号3</li>

</ol>

<ul type="circle">                   --无序列表

<li>第一</li>

<li>第二</li>

<li>第三</li>

</ul>

三、表格

1.基本格式

<table>                           --表格

<tr>                            --行

<td></td>                --单元格

<td></td>

<td></td>

</tr>

<tr>

<td></td>

<td></td>

</tr>

</table>

表示创建一个表格,第一行有3个单元格,第二行有2个单元格

2.属性

border=""     --边框粗细,0或1

width=""       --宽度,   px或%

height=""      --高度,   px或%

align=""        --水平排列格式,center/left/right

valign=""       --垂直排列格式,middle/top/bottom

bgcolor=""       --背景色

background=""    --背景图片

cellspacing=""      --单元格之间的间距  外间距

cellpadding=""     --单元格与内容的间距    内间距

3.去掉浏览器界面中表格四周的空白边框

在<head></head>输入如下代码:

<style type="text/css">

*{

padding:0px;

margin:0px;

}

</style>

四、超链接

<a href="链接地址">图片/文字</a>     --点击图片/文字直接从本页面跳转到链接页面

注:链接地址如果是本地地址,填写相对路径即可;链接地址如果是公共网址,则必须加http://

<a href="链接地址" target="_blank">图片/文字</a>    --点击图片/文字,会新建网页跳转到链接页面

【2017-03-20】HTML基础知识,标记,表格,表格嵌套及布局,超链接的更多相关文章

  1. 前端开发:css基础知识之盒模型以及浮动布局。

    前端开发:css基础知识之盒模型以及浮动布局 前言 楼主的蛮多朋友最近都在学习html5,他们都会问到同一个问题 浮动是什么东西?  为什么这个浮动没有效果?  这个问题楼主已经回答了n遍.今天则是把 ...

  2. 做好SEO需要掌握的20个基础知识

    作为一个网站优化者,有一些基础seo知识点是大家必须要掌握的,网站排名的好快,和这些基础的SEO优化知识有没做好,有没做到位,有着直接的关系!今天,伟伟SEO就把我前面讲的SEO优化基础知识做个总结, ...

  3. 1.20 Python基础知识 - python常用模块-1

    一.time和datetime 1.time模块 1)time.process_time() >>> import time >>> time.process_ti ...

  4. 20.Nodejs基础知识(上)——2019年12月16日

    2019年12月16日18:58:55 2019年10月04日12:20:59 1. nodejs简介 Node.js是一个让JavaScript运行在服务器端的开发平台,它让JavaScript的触 ...

  5. 2017/05/20 java 基础 随笔

    static 关键字的特点 1.随着类的加载而加载 2.优先于对象存在 3.被类的所有对象共享 如果某个成员变量是被所有对象共享的,那么他就应该定义为静态的 4.可以通过类名调用 其实它本身也可以通过 ...

  6. CSS3 网格布局(grid layout)基础知识 - 隐式网格自己主动布局(grid-auto-rows/grid-auto-columns/grid-auto-flow)

    网格模板(grid-template)属性及其普通写法(longhands)定义了一个固定数量的轨道.构成显式网格. 当网格项目定位在这些界限之外.网格容器通过添加隐式网格线生成隐式网格轨道. 这些隐 ...

  7. 【2017-03-20】HTML基础知识、文字标记、图片标记、空格换行、表格、表格嵌套及布局、超链接

    一.HTML基础知识 HTML: 网站(站点) - 网页 网站是由一个或者多个网页组合起来的 HTML作为文件后缀名,可以把文件变为网页 HTML是一门编程语言的名字:超文本标记语言 超越了文字的范畴 ...

  8. Java学习-033-JavaWeb_002 -- 网页标记语言JSP基础知识

    JSP 是 Sun 公司提倡的一门网页技术标准.在 HTML 文件中,加入 Java 代码就构成了 JSP 网页,当 Web 服务器访问 JSP 请求的时候,首先执行其中的 Java 程序源码,然后以 ...

  9. html基础知识2(有序无序列表,表格)2017-03-08

    摘要:php 基础知识2   重点:有序无序列表:<a>标签:<table>标签  内容容器 1.段落标签 <p></p> 注: 执行前后换行,并空一行 ...

随机推荐

  1. wait()函数的详细分析

    之前一直没太深入的去理解wait()函数,今天机缘巧合之前又看了看,发现之前没有真正的理解该函数. 众所周知,wait()函数一般用在父进程中等待回收子进程的资源,而防止僵尸进程的产生. (In UN ...

  2. 洛谷P2633 Count on a tree 主席树

    传送门:主席树 解题报告: 传送门! umm这题我还麻油开始做 所以 先瞎扯一波我的想法,如果错了我就当反面教材解释这种典型错误,对了我就不管了QwQ 就直接dfs,在dfs的过程中建树 然后就直接查 ...

  3. java版迷宫

    当年学数据结构,正好java也刚刚学会gui编程,就想着结合起来做个小东西,然后这个自动走路的小球就出来了. 一个方向的枚举Dir.java public enum Dir { L,U,R,D } 结 ...

  4. IQ调制原理

    现代通信中,IQ调制基本上属于是标准配置,因为利用IQ调制可以做出所有的调制方式. 但是IQ调制到底是怎么工作的,为什么需要星座映射,成型滤波又是用来干嘛的.这个呢,讲通信原理的时候倒是都会泛泛的提到 ...

  5. python json 模块

    什么是json? json是返回的是字符串格式,把python数据类型列表.字典转换成json字符串格式, 这种格式java php 其他语言都可以认识的字符串,可以跨语言交流. json,用于字符串 ...

  6. discuz优化10个小技巧

    Discuz论坛是国内使用最多的论坛系统,现在最新版为X 3.4,X3.4 从 2018 年 1 月 1 日起只在官方 Git 发布,地址:https://gitee.com/ComsenzDiscu ...

  7. wordpress用Elementor拖拽生成酷炫页面

    很多朋友看到wordpress网站做得很高大上,想知道是怎么做到的,其实很简单,用Elementor就能拖拽生成酷炫页面,ytkah就直接上干货了. 1.安装Elementor,到wordpress后 ...

  8. OC动画:CAKeyframeAnimation

    // 方法一 用法1​ Value方式 //创建动画对象 CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyP ...

  9. what's the 头寸

    头寸,是一种市场约定,承诺买卖外汇合约的最初部位,买进外汇合约者是多头,处于盼涨部位:卖出外汇合约为空头,处于盼跌部位.头寸可指投资者拥有或借用的资金数量. “头寸”一词来源于近代中国,银行里用于日常 ...

  10. Ubuntu中Redis的安装与使用

    安装 安装Redis服务器端 apt-get install redis-server 安装完成后,Redis服务器会自动启动,我们检查Redis服务器程序. 检查Redis服务器系统进程 ps -a ...