html常用标签及基础用法

行标签:同类标签可在一行显示,高度由内容撑开 (display:inline)
常见的有:span b em i img a strong s 等
基本特性:不能设置宽高属性,margin,padding 上下无效,左右有效

块标签:独占一行,宽度默认为100% (display:block)
常见的有:div p h1-h5 ul li ol tr th td
基本特性:能设置宽高属性,margin,padding都有效

行内块标签:在行标签中就有那么几个特殊标签(display:inline-block)
如:img input 等
基本特性:
a. 和相邻行内元素在同一行,但是之间会有空白缝隙。
b. 默认宽度是他本身内容的宽度。
c. 宽度、高度、行高、外边距以及内边距都可以手动设置。
标签的基本用法
a标签:
属性:href 跳到外部资源
target _black 打开新页面跳转
_self 当前页面跳转
锚跳转:

 <a href=”#dfg”>锚跳转</a> 
 <div id=”dfg”></div>

4种状态
a:link 未被点击的
a:visited 已经被点击的
a:hover 鼠标放上去的
a:active 正在被点击的

img标签:可以直接设置宽高属性
alt当图片加载失败时显示
title鼠标放上去显示的内容
ul 属性名type=disc实心 square正方形 circle圆 空心
特殊字符&nbsp; &copy; © &clubs; ♣ &ensp; &emsp;
&nbsp;:这是我们使用最多的空格,也就是按下space键产生的空格。
&ensp;:此空格有个相当稳健的特性,就是其占据的宽度正好是1/2个中文宽度,而且基本上不受字体影响。
&emsp;:此空格也有个相当稳健的特性,就是其占据的宽度正好是1个中文宽度,而且基本上不受字体影响。

表单
input类型
text 纯文本框 placeholder value
password 密码框
radio 点选框 checked=”checked”默认选中
textarea 多行文本框 rows行 cols列
checkbox 复选框 checked=”checked”默认选中
select 多选框 结合option使用 默认选中selected=”selected”
button 只是一个按钮
submit 提交按钮
reset 重置按钮
fieldset对元素进行分组 legend定义标题
file
image
date
time
email
color
range
search
tel
url
border=>表格的边框

表格:
caption 标题标签

<table>
  <caption></caption>
  <thead>
    <tr>
      <th>1</th>
    </tr>
  </thead>
  <tbody>
    <tr>
       <td>s</td>
    </tr>
  </tbody>
</table>

bordercolor==>边框的颜色
align 放到table里面,表格整体剧中, 放到tbody里面内容剧中
cellspacing=‘0’ 合并表格的边框
cellpadding 每个格子的空间
bgcolor 表格的背景颜色
rowspan合并行 colspan合并列

发布了25 篇原创文章 · 获赞 0 · 访问量 648

猜你喜欢

转载自blog.csdn.net/JamesHKK/article/details/104195756