码迷,mamicode.com
首页 > Web开发 > 详细

HTML基础-常用标签及图片

时间:2018-09-20 17:20:30      阅读:188      评论:0      收藏:0      [点我收藏+]

标签:cin   换行   文本   通过   目标   技术分享   单元   gif   style   

标记/标签{元素}

  双标签:

    <标签>内容</标签>

    <html></html>    网页 页面的根元素

    <head></head> 头部

    <body></body>  主体

    <p></p>  段落

    <h1></h1>   .....h2-h6 标题

    <table></table>   表格....

  单标签:

    <标签> 内容

    例如:<img>图片    <br> 换行 <hr> 水平线....

 

 

 

常用标签

  段落<p></p>,默认存在段间距

  <br>换行

  空格&nbsp;  

  小于号< &lt;  left

  大于号>&gt;right

  双引号"&quot;

  <b></b>  加粗  在网页中,比较重要的文本通过粗体方式显示

  <i></i> 倾斜

  <u></u> 下划线

  <em></em>强调

  <strong></strong> 加强强调

  <hr></hr> 水平线标记

  版权符技术分享图片&copy;

 

  注册符技术分享图片&reg;

 

网页中常用的图像格式有gif、jpg、png等

  -gif:最多256中颜色,支持透明、动画

  -jpg:支持1670万种颜色,文件较小

  -png:无损压缩图像文件,文件较大,支持透明

  -bmp:位图 psd源文件,不能用于网页

图像标记<img>

  -属性:

    src:图片路径 

      路径分为两种,一种绝对路径(完整的描述文件的位置C:/image/a.jpg),一种相对路径(就是网页相对目标位置  站点内部相对路径../上一级.../上上一级)

    alt:提示文字  如果图片没有显示出来会提示!

    title:标题(鼠标弹出框)

    width/height:宽高

    broder=“75” :边框

      <img src="02.jpg" alt="log" width="50" height="50" align="right" />

      <标签名 图片路径=“值”  提示文字=“值”  宽 高 >内容</标签名>

 

 

表格table  tr行、td列 单元格内容

<table>

  <tr>

    <td>姓名</td>

    <td>体重</td>

  </tr>

  <tr>

    <td>杜伟</td>

    <td>180cm<td>

  </tr>

</table>

 table 属性

 Width、height 宽高(单位像素或百分比 默认不是100%)

align:对齐

border:外边框

bgcolor:背景色

 

特有属性

  cellspacing:单元格间距默认2个像素

  cellpadding:单元格边距(边框与内容的间距)内边距

设置tr属性

  align    水平对齐   left  right  center

  bgcolor 背景色

 

设置td的基本属性

  align valign 水平对齐、垂直对齐

  bgcolor:背景色

  background:指定背景图片

  <td colspan="3" >水平合并 合并列

  rowspan=“2” 垂直跨度 合并行

  合并必须是相邻的单元格

 

水平合并colspan

<table>

<tr>
<td colspan="2">&nbsp;</td>
<td>&nbsp;</td>
</tr>

</table>

垂直合并rowspan

  

<table width="500" height="200" border="2">
1行<tr>
<td rowspan="2"></td>
<td> &nbsp;</td>
</tr>
2行<tr>
<td>&nbsp;</td>
</tr>
</table>技术分享图片

垂直合并也就是单元格1-3合并 那就要在1单元格上写 rowspan=“2” 在把第二行的3单元格删掉

HTML基础-常用标签及图片

标签:cin   换行   文本   通过   目标   技术分享   单元   gif   style   

原文地址:https://www.cnblogs.com/xiaowie/p/9681630.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!