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

HTML手稿

时间:2019-12-29 12:44:53      阅读:113      评论:0      收藏:0      [点我收藏+]

标签:一个   ble   段落   显示   嵌套   语义   删除   html   amp   

1.网页中web 标准的三层组成?

W3C 万维网联盟

 结构(HTML)、表现(CSS)、行为(JAVASCRIPT)

 

标签分类:

双标签

单标签

 

标签关系:

嵌套关系

并列关系

<html lang = ‘zh-CN‘>   语言种类

<mate charset = ‘‘UTF-8>  字符集.万国码(各个国家都能显示页面的语言)

 

HTML 标签语义化

让结构跟清晰

 

排版标签

<h> 标题标签

<p> 段落标签

<hr/> 水平线标签

<br/> 换行

 

没有语义

<div></div>  一行只能放一个。。。

span            一行能放多个

 

文本格式化标签

i    斜体

 

strong  加粗

b       加粗

 

s          删除线

del      删除线

 

u     下划线

ins    下划线

 

标签属性

img     

alt (不能显示图片时替换文本)

title   鼠标停留

width 宽度

height  高度

borde  边框( 在图片边 加上一个框)

 

a

内部链接

外部链接   加http

href    跳转目标  # (代表一个空)

target   self     _blank 

a标签可以套img

 

路径

相对路径

../上一级目录

 

锚点定位

当点击某一个点,立即跳转到具体网页位置

<h3 id="two">第二集</h3>     具体定位的文本

<a href = "#two"> 链接文本 </a>     点击文本

 

<base target = "_blank">  设置所有的a标签属性都在新窗口打开

 

 特殊字符

&nbsp  

<div>&ls &ls<div>  小于号以后这样写

 

 

表格

显示,展示数据。才使用

<table>

  <thead><thead>

  <tbody><tbody>

</table>

 

<table>

  <caption><h3>表头</h3></caption>

  <tr>

    <th></th>

  </tr>
  <tr>

    <td></td>

  </tr>

</table>

 

表格的结构划分

<thead><thead>    用来定义表格头部 用来放标签之类的

<tbody><tbody>    用来定义表格主体

<tfoot></tfoot>     放表格脚注

表格属性

th表头单元格会加粗显示 

border = ‘1‘   边框

width     宽

height   高

align    水平对齐方式   left   right   center.  不是表格中的数据 而是文档流中

cellspacing     单元格与单元格之间的距离

cellpadding     子和边框的距离

 

合并单元格

跨行合并

-

-

-
<td rowspan = ‘2‘>照片</td> 

多余的单元格删除掉 

跨列合并

---------------

<td colspan = ‘3‘>照片</td> 

多余的单元格删除掉 

 

列表标签

自由组合度更高

有序列表

<ol>

  <li></li>

</ol>

无序列表

<ul>

  <li></li>

</ul>

自定义列表

<dl>

  <dt>湖南</dt>

  <dd>长沙</dd>

  <dd>株洲</dd>

</dl>

 

表单

redio 

checked=’checked‘ 默认选中

 

chekbox

checked=’checked‘ 默认选中

 

button

img 图片提交按钮

<input type = ‘image‘ src = ‘#‘><input/>

 

lable

<lable for=‘id‘></lable>

获得输入光标焦点

 

 

不用双引号

HTML手稿

标签:一个   ble   段落   显示   嵌套   语义   删除   html   amp   

原文地址:https://www.cnblogs.com/Rivend/p/12114583.html

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