软件交互设计

基本框架


"en">
  
    "UTF-8" />
    "viewport" content="width=device-width, initial-scale=1.0" />
    
  
  

链接

  1. 在新窗口打开链接
"" target="_blank">
  1. 链接到同一个页面的不同位置
"#C4">查看Chapter 4
"C4">Chapter 4
  1. 跳出框架
"/index.html"
target="_top">请点击这里! 
  1. 创建电子邮件链接
"mailto:[email protected]?subject=Hello%20again">发送邮件

**注:**使用%20替换单词之间的空格,使浏览器可以正确显示文本

图像

  1. 创建图像映射
""
border="0" usemap="#planetmap"
alt="Planets" />

"planetmap" id="planetmap">

"circle"
coords="180,139,14"
href =""
target ="_blank"
alt="Venus" />

"circle"
coords="129,161,10"
href =""
target ="_blank"
alt="Mercury" />

"rect"
coords="0,0,110,260"
href =""
target ="_blank"
alt="Sun" />


图像标签:

表格

注:空单元格使用空格占位保证边框显示完整

  1. 没有边框的表格:不设置border属性
  2. 表格标题元素
"6">
  1. 单元格跨行/跨列:colspan属性和rowspan属性
  2. 边框合并
 table {
    border-collapse: collapse;
  }

列表

  1. 无序列表
  1. 有序列表
  1. 自定义列表

    

布局

  • HTML5 语义元素
元素 含义
header 定义文档或节的页眉
nav 定义导航链接的容器
section 定义文档中的节
article 定义独立的自包含文章
aside 定义内容之外的内容(比如侧栏)
footer 定义文档或节的页脚
details 定义额外的细节
summary 定义 details 元素的标题

框架

作用:在同一窗口显示不止一个页面

"25%,50%,25%">
  "">
  "">
  "">

脚本








不支持 JavaScript 的浏览器将显示 noscript 元素中的文本。

路径

  • 绝对文件路径:指向一个因特网文件的完整URL
  • 相对路径:指想向相对于当前页面的文件

单选框

"radio" name="sex" value="male" checked>Male

多个选项的name属性相同但是value属性不同

你可能感兴趣的:(前端学习笔记)