HTML基础建站知识

               目前互联网上的网站在展现给用户的界面都是需要用到HTML框架。html应用范围很广泛,不管是WEB前端还是后台都需要懂得HTML的基础;在HTML中经常要接触到的就是标签;那啥是标签呢?极简单的来说就是固有的命令,比如:“立正”“跨立”...之类的命令单词。

              看一下百度百科怎么说的:

html标签 
   超文本标记语言(外国语简称:HTML)标记标签通常被称为HTML标签,HTML标签是HTML语言中最基本的单位,HTML标签是HTML(标准通用标记语言下的一个应用)最重要的组成部分。
   HTML标签的大小写无关的,例如“主体”<body>跟<BODY>表示的意思是一样的,推荐使用小写。

           经常去写一些比较基础的HTML久了就知道那些是标签单词;那一个基础的html有哪些结构呢?不妨我们来看看HTML的简单结构。

构成一个网页必须要用的标签和网页基础的结构:

<html>

<head>
  这里是网页的头部 ... ...
  ...
</head>

<body>
  这里是网页的主体 ... ...
  ...
</body>

</html>

HTML中重要的除了标签之外还有标签里属性也是一样的重要;可以说web前端HTML建站都是用标签和属性码起来的。属性为 HTML 元素提供附加信息。

HTML 属性
HTML 标签可以拥有属性。属性提供了有关 HTML 元素的更多的信息。
属性总是以名称/值对的形式出现,比如:name="value"。
属性总是在 HTML 元素的开始标签中规定。

属性实例
HTML 链接由 <a> 标签定义。链接的地址在 href 属性中指定:
<a href="http://www.claidx.com">成都小生网络营销培训学院</a>

这里整理了一些HTML建站常的一些标签单词和属性单词,可以初步了解一下HTML标签和属性的功能

<html></html>  表示一个标准的html网页, <html>表示网页开始
</html>表示网页结束
<head></head>   表示网页的头部
<title></title>   表示网页的标题
<body></body>  表示网页主体
<br/>   (单标签)  换行
<p></p>    段落(换行、段间距)
<b></b>  加粗
<strong></strong>   加粗(强调)
<i></i>    倾斜
<em></em>  倾斜(强调)
h标签       文章标题
从<h1><h6>
 效果:(改变文字大小、加粗、段落、强调)
<center></center>   居中
格式:<标签名称 属性1="值" 属性2=“值”></标签名称>
<font></font>   文字样式
     属性: color颜色; size 字号;face字体;
<hr/>  (单标签)
     属性:  color颜色 ; size粗细;  width宽度(长)
<img />      图片
     属性: src图片路径 ; width宽度  ;height高度; title标题(弹出提示文字); alt     替换文字(图片不能显示时,用文字替代)
<a></a>    超链接
 属性: href路径(如果href里的路径是一个网址,那么前面一定要带http://)

锚链接:在同一个页面的不同位置之间跳转
实现方式:
<p id=”标签”></p>
<a href=”#标签”>我是标签</a>

<body></body>
     属性: bgcolor   背景颜色;background   背景图片

<embed></embed>   
属性:   wmode="transparent  flash背景透明
       width     宽度
       height    高度
<ul></ul>      无序列表
<li></li>表示列表中的一项
属性 type    列表样式
disc    实心圆   circle 空心圆   square方块
<ol></ol>    有序列表
属性 type   列表样式
1  阿拉伯数字;a  小写字母; A  大写字母; i  罗马数字(小写); I 罗马数字(大写)
<dl></dl>    自定义列表
列表:<dt></dt>或者<dd></dd>(仅用于自定义列表)

<table></table>   表格
<tr></tr>表示一行  <td></td>表示一个单元格
注意:内容写在<td>里面
属性: border   边框 ; width    宽度 ; height   高度 ; 
align对齐方式值 :  left左   center中   right右
bordercolor   边框颜色 bgcolor   背景颜色 background   背景图片
cellspacing   单元格间距
<td></td>
属性:  colspan    跨越(横向)  rowspan   跨越(纵向)
<iframe></iframe>   框架
 width 宽度     height 高度   frameborder   框架边框
备注:iframe中调用的内容,不能被搜索引擎识别
<div></div>      层(盒子)
 CSS      层叠样式表
CSS属性
 border-style    边框样式 值:solid实线;dotted虚线;double   双实线
 border-color   边框颜色
 border-width    边框粗细
 margin  四周间距

margin:auto   (居中)
margin-top 上间距;margin-bottom 下间距
margin-left   左间距;margin-right  右间距
width     宽度;height    高度
background-color  背景颜色
background-image   背景图片 值:  url(图片路径)
background-repeat   背景重复方式
值:  no-repeat 不重复; repeat-x  横向重复;repeat-y  纵向重复
background-position   背景位置
 值: center 中;left 左;right 右;top 上;bottom下或2个表示坐标的数字
background
background-size    背景大小
float 漂浮(浮动)值:left 左;right右
padding          四周填充
   padding-top          上填充
   padding-left          左填充
   padding-right        右填充
   padding-bottom     下填充
font 文本
font-size   字号
   font-family    字体
   color      颜色     
   font-weight:bold   加粗
text-indent:2em  首行缩进2字符
text-align    文本对齐方式
         值:   left; center; right
line-height     行高
text-decoration   文本样式
                    值:   none   无;underline  下划线
 overline   上划线; line-through   删除线 
display     显示方式
          值: block 块状显示 ;none   无(隐藏) 
class 类选择器
:hover    是一个伪类,鼠标悬停
原文地址:https://www.cnblogs.com/claidx/p/9175076.html