HTML——基本html标签
基本html标签
<html> ... </html> 定义HTML文档
<head> ... </head> 文档的信息
<meta /> HTML文档的元信息
<title> ... </title> 文档的标题
<link /> 文档与外部资源的关系
<style> ... </style> 文档的样式信息
<body> ... </body> 可见的页面内容
<!-- ... --> 注释
文本标签:
<h1> ... </h1> 标题字大小 ( h1~h6 )
<b> ... </b> 粗体字
<strong> ... </strong> 粗体字 (强调)
<i> ... <i> 斜体字
<em> ... </em> 斜体字(强调)
<center> ... </center> 居中文本
<ul> ... </ul> 无序列表
<ol> ... </ol> 有序列表
<li> ... </li> 列表项目
<a href="链接值"> ... </a> 超链接
<font> ... </font> 定义文本字体,尺寸,颜色,大小 (淘汰)
<sub> ... </sub> 下标
<sup> ... </sup> 上标
<br /> 换行
<p> ... </p> 段落其它
图形标签:
<img src(图片源自)=" ... " /> 定义图像
<img src="1.jpg" width"100px" height"1oopx" />
<hr /> 水平线
表格标签(在网页中显示数据):
<table> ... </table> 定义表格
<th> ... </th> 定义表格中的表头单元格
<tr> ... </tr> 定义表格中的行
<td> ... </td> 定义表格中的单元
<form> ... </form> 定义供用户输入的HTML表单
<frame /> 定义框架集的窗口或框架
form 表单(含输入数据的单子)

<div> ... </div>
三种样式:

<div>1</div>
<div>2</div>
<div>3</div>

<div style="float:left;">1</div>
<div style="float:left;">2</div>
<div style="float:left;">3</div>
(向左浮动)

<div style="float:left;width:100px;height:200px;">1</div>
<div style="float:left;">2</div>
<div style="float:left;">3</div>
补充:
浏览器中不显示图中所画横线(竖线)
样式表中写法:属性:值;
HTML属性:属性名="值"

<div style="float:left;width:100px;height:200px;">1</div>
<div>2</div>
background-color:#333;
背景色
width:30%;
(比例)
例:表格
| 学号 | 姓名 | 成绩 |
| 1001 | 张三 | 95 |
| 1008 | 李四 | 78 |
<table>
<tr>
<th>学号</th><th>姓名</th><th>成绩</th>
</tr>
<tr>
<td>1001</td><td>张三</td><td>95</td>
</tr>
<tr>
<td>1001</td><td>李四</td><td>78</td>
</tr>
</table>
HTML——基本html标签的更多相关文章
- a标签点击跳转失效--IE6、7的奇葩bug
一般运用a标签包含img去实现点击图片跳转的功能,这是前端经常要用到的东西. 今天遇到个神奇的bug:如果在img上再包裹一层div,而且div设置了width和height,则图片区域点击时,无任何 ...
- IE6、7下html标签间存在空白符,导致渲染后占用多余空白位置的原因及解决方法
直接上图:原因:该div包含的内容是靠后台进行print操作,输出的.如果没有输出任何内容,浏览器会默认给该空白区域添加空白符.在IE6.7下,浏览器解析渲染时,会认为空白符也是占位置的,默认其具有字 ...
- 百度MIP页规范详解 —— canonical标签
百度MIP的规范要求必须添加强制性标签canonical,不然MIP校验工具会报错: 强制性标签<link rel="/^(canonical)$/"> 缺失或错误 这 ...
- 【CSS进阶】伪元素的妙用--单标签之美
最近在研读 <CSS SECRET>(CSS揭秘)这本大作,对 CSS 有了更深层次的理解,折腾了下面这个项目: CSS3奇思妙想 -- Demo (请用 Chrome 浏览器打开,非常值 ...
- TODO:Laravel 使用blade标签布局页面
TODO:Laravel 使用blade标签布局页面 本文主要介绍Laravel的标签使用,统一布局页面.主要用到到标签有@yield,@ stack,@extends,@section,@stop, ...
- 最新 去掉 Chrome 新标签页的8个缩略图
chrome的新标签页的8个缩略图实在让人不爽,网上找了一些去掉这个略缩图的方法,其中很多已经失效.不过其中一个插件虽然按照原来的方法已经不能用了,但是稍微变通一下仍然是可以用的(本方法于2017.1 ...
- css-父标签中的子标签默认位置
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...
- xpath提取多个标签下的text
title: xpath提取多个标签下的text author: 青南 date: 2015-01-17 16:01:07 categories: [Python] tags: [xpath,Pyth ...
- 多个Img标签之间的间隙处理方法
1.多个标签写在一行 <img src="/i/eg_tulip.jpg" alt="郁金香" height="100px"/> ...
- html5标签canvas函数drawImage使用方法
html5中标签canvas,函数drawImage(): 使用drawImage()方法绘制图像.绘图环境提供了该方法的三个不同版本.参数传递三种形式: drawImage(image,x,y):在 ...
随机推荐
- URL的三类编码格式(JavaScript实现)
编码函数: 1.escape(): 不编码的字符有69个:* + - . / @ _ 0~9 a~z A~Z 而且escape对0~255以外的Unicode值进行 ...
- 5. STL编程五
1. STL的六大组件: 容器(Container) 算法(Algorithm) 迭带器(Iterator) 仿函数(Function object) 适配器(Adaptor) 空间配置器(alloc ...
- Enum枚举法
java enum(枚举)使用详解 + 总结 enum 的全称为 enumeration, 是 JDK 1.5 中引入的新特性,存放在 java.lang 包中. 下面是我在使用 enum 过程 ...
- table组件选中数据回显
table组件多选状态下,把已选择的数据回显,需要在多选列上加上一个属性 :reserve-selection="true" 实例如下: <el-table :data=&q ...
- Smarty <= 3.1.32 Remote Code execution(CVE-2017-1000480)
Smarty介绍 smarty是一个php模板引擎,其项目地址:https://github.com/smarty-php/smarty 测试环境搭建 下载:https://github.co ...
- CentOS7 安装 PostGIS方法(适合国内网络)
安装Postgresql 9.4 yum install http://yum.postgresql.org/9.4/redhat/rhel-6-x86_64/pgdg-redhat94-9.4-1. ...
- 怎么搭建一个5T的私有云盘
视频 点击打开视频 下载地址 免费域名网址: https://www.freewebhostingarea.com/ ftp工具: http://t.cn/EXWxYUI oneindex: http ...
- windows mobile ,wince 系统,用代码启动cab文件安装
有时候需要用代码来启动安装cab,以下是代码.不能实现静默安装. 启动后会提示用户是否安装,需要用户点击是才行. using System; using System.Collections.Gene ...
- 高性能web服务器(热死你)Resin Linux的安装、配置、部署,性能远超Nginx支持Java、PHP等
高性能web服务器(热死你)Resin Linux的安装.配置.部署,性能远超Nginx支持Java.PHP等 一. 安装resin 1. 下载resin: 下载地址:http://cauch ...
- Steps to install Docker on Manjaro 16.10--转
https://manjaro-tutorial.blogspot.com/2016/12/how-to-install-docker-on-manjaro-1610.html Open Termin ...