Heim > Web-Frontend > HTML-Tutorial > HTML基础知识总结(一)_html/css_WEB-ITnose

HTML基础知识总结(一)_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-24 11:45:11
Original
1103 Leute haben es durchsucht

概述
       HTML是将内容和内容显示形式结合在一起的语言,它对于内容显示形式的控制,主要是通过标签(元素)的属性,由于它对“内容显示形式”存在着很多的弊端,所以之后就出现了CSS,CSS就相当于HTML标签的属性。

HTML元素的形式
       空元素。例:

       带有属性的空元素。例:



       带有内容的元素。例:http://blog.csdn.net/jiben2qingshan
       带有内容和属性的元素。例:http://blog.csdn.net/jiben2qingshan
       注意:对于
这类的标签,我们最好这样写

链接
内部链接
       理论
               1、建立命名锚记,其语法:
               2、建立链接(链接到相应的锚记),其语法:

       举例(主要代码):
               
A点击这个就会跳转到B
               
                B这个就是跳转后的位置
       用途
               同一个网页中;打开指定网页的指定位置(href="index.html#1",可以为绝对地址)

外部链接
       链接到外部网站
              百度
       链接到E-mail
              点击此处会打开默认的电子邮件软件
       链接到FTP
              点击此处可以链接到相应的FTP服务器(一般进入访问FTP服务器需要输入用户名和密码)
       链接到Telnet
              点击此处就可以链接到相应的Telnet服务器
    
 target属性
    取值:_blank,在新窗口中打开被链接文档;_self,默认,在相同的框架中打开被链接文档;_parent,在父框架中打开被链接文档;_top,在整个窗口中打开被链接文档;framename,在指定的框架中打开被链接文档

下载文件        

如果超链接指向的不是一个网页文件,而是其他文件例如zip文件等,单击链接的时候就会下载该文件        歌曲名称

图片
       无图显示汉字
       img便签属性的解释
       src:图片的地址
       alt:当图片不显示时,出现在该位置(原显示图片)的文字
       title:鼠标移至到图片上后出现的文字
       border:图片的边宽,默认为0,边框的颜色黑色,如果是超链接,则和链接文字颜色一致
       vspace:垂直边距,图片在垂直方向上和自己最近的元素的距离
       hspace:水平边距,图片在水平方向上和自己最近的元素的距离
       width,height:如果没有写width和height属性的话,图片就会按照它的原始尺寸显示,有的话就会按它们值的大小显示
       align:图像和“文字”之间的布局
              bottom:图片的底部和当前行的文字底部对齐
              top:图片的底部和当前行的文字顶端对齐
              middle:图片的水平中线和当前行的文字中线对齐
              left:图片左对齐
              right:图片右对齐
              center:图片水平中线和当前行的文字中线对齐(自己试验center和middle的效果一样)

注意        地址一般写成相对地址,尽量不要写绝对地址;“../”表示当前目录的上一级目录,“../../”表示当前目录的上一级的上一级。

表格        表格是网页排版布局不可缺少的一个工具。建立表格一般所用的标签:

、、
。主要操作对象:表格,行,单元格,

       表格标签

           

  建立表格的整体性标签,其主要属性如下        

      width,height:设置表格的宽和高,其值可以为数字,也可以为百分数(表格的长宽是相对浏览器的,会随着浏览器大小的改变而改变),如果其值很大的话,系统会自动按照数据量分配空白位置,如果其值很小的话,系统会以显示完整数据为主,该设置值便自动失效;未指定其属性值,则系统会自动计算表格中字段数据的宽度及高度,以能容纳数据的最小单位显示表格   

  bgcolor,background:设置表格的背景颜色和背景图片。两个属性都是设置背景的,通常只设计其中之一,如果都设置的话,则会显示背景图片          

    border,bordercolor:设置表格边框宽度和表格边框颜色。

border默认为0,浏览器不显示任何边框(表格四周和单元格),border只能影响表格四周的边框尺寸,并不影响单元格边框的尺寸;

bordercolor默认的颜色为黑色,表格边框(四周和单元格)的颜色都改变            

  align:设置表格水平方向的对齐方式(left,center和right),只能对整个表格在浏览器页面范围内居中对齐,但是表格里单元格的对齐方式并不会因此而改变,如果要改变单元格的对齐方式,就需要在行、列或单元格内另行定义  

   cellspacing,cellpadding:设置表格内部每个单元格之间的距离;设置单元格边框与单元格里内容之间的距离,默认情况下,单元格里的内容会紧贴着表格的边框            

  举例(核心代码):

height="50%"

bgcolor="red"

background="2.jpg"

border="5"

bordercolor="red"

align="center"

cellspacing="20"

cellpadding="20">

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage