今天学习html的其他标签:

一、列表

1.无序列表ul

基本结构:

<ul  type="属性值">

<li>列表内容</li>

</ul>

这里的属性值有三种:square  disc  circle

源代码:

<html>
<head>
<meta charset="utf-8">
<title>无序列表</title>
</head>
<body>
<ul type="square">
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<ul>
</body>
</html>

当type="square"时:

当type="disc"时:

当type="circle"时:

2.有序列表ol

基本结构:

<ol type="属性值" start="起始值">

<li>列表内容</li>

</ol>

这里的属性值有5种:1,a,A,i,I

1 阿拉伯数字:1,2,3,…
a 小写字母:a,b,c,…
A 大写字母:A,B,C,…
i 小写罗马数字:i,ii,iii,…
I 大写罗马数字:I,II,III,…

起始值:整数值

例子:

打印显示:

二、frameset框架

基本结构:

<frameset   cols=“按列百分比”  rows=“按行百分比”  frameborder=“边框”>
<frame src=“html路径” />
<frame src=“html路径” />
<frame src=“html路径” noresize/>  <!-- “noresize”当前html不能拖拽 -->
</frameset>

<!--  注释内容 -->

注意:使用frameset不能使用body标签。

源代码:

<html>
<head>
<title>框架</title>
<meta charset="utf-8">
</head>
<frameset cols="50%,*" frameborder="1">
<frame src="案例一.html"/>
<frame src="案例二.html"/>
</frameset>
</html>

这里的* 表示剩余部分。

显示效果:

补充:如果想去掉中间分隔的黑线,设置属性frameborder="0"

如果想设置多层分割,需要嵌套框架:

例如:

<frameset cols="50%,*" frameborder="1">

<frameset rows="50%,*">
<frame src="案例一.html"/>
<frame src="案例二.html"/>
</frameset>

<frameset rows="50%,*">
<frame src="案例三.html"/>
<frame src="案例四.html"/>
</frameset>

</frameset>

结果就是:

网页设计——6.html其他标签的更多相关文章

  1. 网页设计——4.html基本标签链接,图片,表格

    今天主要认识一个有趣的html标签 1.超链接标签a 基本结构:<a href="url" >内容 </a> url就是网页地址. 但直接用这种超链接,会自 ...

  2. 自适应网页设计(Responsive Web Design)

    引用:http://www.ruanyifeng.com/blog/2012/05/responsive_web_design.html 随着3G的普及,越来越多的人使用手机上网. 移动设备正超过桌面 ...

  3. 手机web——自适应网页设计(html/css控制)

    一. 允许网页宽度自动调整: "自适应网页设计"到底是怎么做到的? 其实并不难. 首先,在网页代码的头部,加入一行viewport元标签. <meta name=" ...

  4. HTML5+CSS3的响应式网页设计:自动适应屏幕宽度

    这几天都在修改博客上面的样式.本来用的是d83.0的模板.自己又修改了许多地方,其中自己修改的一些地方在手机里面显示的效果不是很理想,于是想改成自适应的效果.对CSS3不是特别的熟练,只能去网上找找案 ...

  5. 无障碍网页设计(WCAG2.0)

    无障碍化是指无论健全人还是残疾人,年轻人还是老年人都可以平等地获取互联网上的信息和服务.无障碍化网站建设不单可以增加网站的受益群体,更是一个有情怀.有担当的互联网企业的责任,也是一个互联网从业人员应该 ...

  6. 网页设计、java、Andorid资源清单整理

    多学多练做笔记很重要. 赤裸裸的干货非鸡汤 网页设计的主要技术:    Html,    Js,    Css,    Ps       HTML/HTML5     网页的基础Html必须知道的.但 ...

  7. paip.自适应网页设计 跟 响应式 设计的区别跟原理and实践总结

    paip.自适应网页设计 跟 响应式 设计的区别跟原理and实践总结 响应式Web设计(Responsive Web design)的理念是: 1 #-----------自适应布局VS响应式布局 2 ...

  8. PS网页设计教程XXIV——从头设计一个漂亮的网站

    作为编码者,美工基础是偏弱的.我们可以参考一些成熟的网页PS教程,提高自身的设计能力.套用一句话,“熟读唐诗三百首,不会作诗也会吟”. 本系列的教程来源于网上的PS教程,都是国外的,全英文的.本人尝试 ...

  9. 如何去设计一个自适应的网页设计或HTMl5

    如何去设计一个自适应的网页设计或HTMl5 如今移动互联网随着3G的普及,越来越火爆,更多需求跟随而来!APP应用市场和APP应用数量成倍成倍的增长!从而给移动互联网带来新的挑战! 移动设备正超过桌面 ...

随机推荐

  1. Python多进程应用

    在我之前的一篇博文中详细介绍了Python多线程的应用:  进程,线程,GIL,Python多线程,生产者消费者模型都是什么鬼 但是由于GIL的存在,使得python多线程没有充分利用CPU的多核,为 ...

  2. Ipad,IPhone(矩阵求递推项+欧拉定理)

    Ipad,IPhone Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total S ...

  3. phonegap与H5中的接口对比

    接口 HTML5 phonegap 差异 地理定位 geolocation 单次定位: navigator.geolocation.getCurrentPosition(Success, [error ...

  4. javascript中toString和valueOf方法的区别

    toString():将对象转为字符串 valueOf():获取对象的原始值, 1.针对基本类型的变量:如在string,number,boolean类型的变量上调用这两个方法时,直接返回原始值,即变 ...

  5. javascript中自定义事件

    自定义事件:用户可以指定事件类型,这个类型实际上就是一个字符串,然后为这个类型的事件指定事件处理函数,可以注册多个事件处理函数(用数组管理),调用时,从多个事件处理函数中找到再调用. function ...

  6. 全局作用域 eval

    eval是在caller的作用域里运行传给它的代码: var x = 'outer';   (function() {     var x = 'inner';     eval('x'); // & ...

  7. cross-document message 跨文档通信 HTML5

    跨域通信HTML5提供了XDM(cross-document message)安全简单接口:   核心是 postMessage()方法,用来向另一个地址传送信息: var iframeWindow ...

  8. IE下 GIF不动失效的奇葩问题

    IE下(IE6~IE9都有该问题),对页面进行了某些操作之后,页面上的GIF动画就停留在某一帧不动了~~~ !! 我大IE 就是这么奇葩. 搜索了一下,搞了好久总算搞定. 下面说下目前了解的所有的可能 ...

  9. 【APP问题定位(一)】夜神模拟器安装及问题

    本文较少下夜神模拟器的使用,包括了夜神安装,APK安装,开发者选项打开. 安装夜神模拟器 到    夜神模拟器     网站自行下载安装文件,双击exe文件安装,选择"自定义安装" ...

  10. js个位数补0

    //获取并格式化当前时间 var _getTime = function(){ var arr=['00','01','02','03','04','05','06','0,'08','09'], / ...