今天学习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. CSS3新特性汇总

    新增选择器 p:nth-child(n){color: rgba(255, 0, 0, 0.75)} 弹性盒模型 display: flex; 多列布局 column-count: 5; 媒体查询 @ ...

  2. code force 403C.C. Andryusha and Colored Balloons

    C. Andryusha and Colored Balloons time limit per test 2 seconds memory limit per test 256 megabytes ...

  3. D3.js从入门到“放弃”指南

    前言 近期略有点诸事不顺,趁略有闲余之时,玩起D3.js.之前实际项目中主要是用各种chart如hightchart.echarts等,这些图形库玩起来貌都是完美的,一切皆可配置,但几年前接触了D3之 ...

  4. Android 开发笔记___图像视图

    <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=&quo ...

  5. 解决Android下元素滑动问题

    移动端左右.上下滑动: 当页面中既需要页面滑动操作,又需要上下或左右滑动页面上的某个元素时,直接使用zepto中提供的swipe事件是不能直接达到目的的,原因如下: (1)在Android低端机上to ...

  6. jQuery_事件学习

    一.click事件 click事件----鼠标单击事件 $('.bt').click(function() { alert("本身的事件");}) 当class为bt的div被但单 ...

  7. python小小面试题

    一.python是如何进行内存管理的?Python引入了一个机制:引用计数.python内部使用引用计数,来保持追踪内存中的对象,Python内部记录了对象有多少个引用,即引用计数,当对象被创建时就创 ...

  8. 一起写框架-Ioc内核容器的实现-基础功能-ComponentScan支持多包扫描(六)

    实现功能 1.我们看到@ComponentScan注解一个开始定义就是需要支持,扫描多个包,将多个包的类名获取到.现在就实现这个功能. 实现思路 根据传入的字符串数组,获得多个包下的类全限制名. 实现 ...

  9. 网页加速特技之 AMP

    据统计,40%的人会放弃使用加载时间超过3秒的网站.对于加载慢的页面我也是没耐心等待的,同类型网站那么多,为什么不选择加载速度更快体验更好的呢.为了解决网页加载慢的问题,Google联合数十家技术机构 ...

  10. JAVA学习摘要

    JAVA关键字 JAVA数据类型 数据类型的使用实例 JAVA注释的使用 使用文档注释时还可以使用 javadoc 标记,生成更详细的文档信息: @author 标明开发该类模块的作者 @versio ...