喵宅苑 MewoGarden × 技术宅社区II | Z站 Z Station 棒棒哒纯文字二次元技术社区

正文

HTML 简易教程

作者:软软的上嘴唇
HTML 是用来描述网页的一种语言。他不是一种程序语言而是一种标记语言 他不要任何辅助的客户端软件不需要任何web服务器 打开你的记事本 今天我们就让你亲手编辑一个网页 HTML代码测试框 以下是html的基础知识 html标签是由尖括号包围的关键词,比如 <html> htnl标签通常是成对出现的,比如 <b> 和 </b> 标签对中的第一个标签是开始标签,第二个标签是结束标签 比如 <html> <body> <h1>技术宅</h1> <p>网页制作</p> </body> </html> html标签 想要用html做网页就必须熟记这些标签 <html> 与 </html> 之间的文本描述网页 <body> 与 </body> 之间的文本是可见的页面内容 这个必须出现在开头结尾 <h1> 与 </h1> 之间的文本被显示为标题 HTML 标题是通过 <h1> - <h6> 等标签进行定义的,依次变小 <p> 与 </p> 之间的文本被显示为段落,相当于换行,回车 连接用的<a> 例如:<a href="https://www.gn00.com">技术宅(这里是链接文字)</a> 图像用<img> 例如:<img src="w3school.jpg" width="104" height="142" /> 注意,如果你想用到图片 网络图片需要用到连接,本地图片需要路径 <br /> 就是没有关闭标签的空元素,定义换行 下面我们举三个例子,大家可以把代码复制到 HTML代码测试框 运行一下看看效果 (1)使用滚动,表示样式,图片 [mw_shl_code=html,true]<html> <body> <!><marquee height=60><font color=#FF0000>欢 迎 你 进 入 软 软 的 抖 S 调 教 场</font></marquee></!> <br /> <br /> <br /> <center><h1><b>技术宅</b></h1></center> <p><center><h3><b>简易网页制作<img src=http://m2.img.papaapp.com/farm4/100/23951AFBC40D7BA88A11CDF4492F3464_80_80.GIF></img></b></h3></center></p> </body> </html>[/mw_shl_code] (2)使用表格@NateSilver [mw_shl_code=html,true]<html> <body> <h4>NateSilver</h4> <table border="1"> <tr> <td bgcolor="red">纯洁度</td> <td>100</td> </tr> <tr> <td>天真度</td> <td>100</td> </tr> </table> </body> </html>[/mw_shl_code] 还有很多下面是的html 标签 <!> 跑马灯
<marquee>...</marquee>普通卷动
<marquee behavior=slide>...</marquee>滑动
<marquee behavior=scroll>...</marquee>预设卷动
<marquee behavior=alternate>...</marquee>来回卷动
<marquee direction=down>...</marquee>向下卷动
<marquee direction=up>...</marquee>向上卷动
<marquee direction=right></marquee>向右卷动
<marquee direction=left></marquee>向左卷动
<marquee loop=2>...</marquee>卷动次数
<marquee width=180>...</marquee>设定宽度
<marquee height=30>...</marquee>设定高度
<marquee bgcolor=FF0000>...</marquee>设定背景颜色
<marquee scrollamount=30>...</marquee>设定滚动速度
<marquee scrolldelay=300>...</marquee>设定卷动时间
<marquee>...</marquee>鼠标经过上面时停止滚动
<marquee>...</marquee>鼠标离开时开始滚动
字体效果
<h1>...</h1>标题字(最大)
<h6>...</h6>标题字(最小)
<b>...</b>粗体字
<strong>...</strong>粗体字(强调) (同上效果略同)
<i>...</i>斜体字
<em>...</em>斜体字(强调)
<dfn>...</dfn>斜体字(表示定义)
<u>...</u>底线
<ins>...</ins>底线(表示插入文字)
<strike>...</strike>横线
<s>...</s>删除线
<del>...</del>删除线(表示删除)
<kbd>...</kbd>键盘文字
<tt>...</tt> 打字体
<xmp>...</xmp>固定宽度字体(在文件中空白、换行、定位功能有效)
<plaintext>...</plaintext>固定宽度字体(不执行标记符号)
<listing>...</listing> 固定宽度小字体
<font color=00ff00>...</font>字体颜色
<font size=1>...</font>最小字体
<font style =font-size:100 px>...</font>无限增大
区断标记
<hr>水平线
<hr size=9>水平线(设定大小)
<hr width=80%>水平线(设定宽度)
<hr color=ff0000>水平线(设定颜色)
<br>(换行)
<nobr>...</nobr>水域(不换行)
<p>...</p>水域(段落)
<center>...</center>置中
连结格式
<base href=位址>(预设好连结路径)
<a href=位址></a>外部连结
<a href=位址 target=_blank></a>外部连结(另开新视窗)
<a href=位址 target=_top></a>外部连结(全视窗连结)
<a href=位址 target=’页框名’></a>外部连结(在指定页框连结)
贴图/音乐
<img src=图片位址>贴图
<img src=图片位址 width=180>设定图片宽度
<img src=图片位址 height=30>设定图片高度
<img src=图片位址 alt=’提示文字’>设定图片提示文字
<img src=图片位址’ border=1>设定图片边框
<bgsound src=MID音乐档位址>背景音乐设定
表格语法
<table aling=left>...</table>表格位置,置左
<table aling=center>...</table>表格位置,置中
<table background=图片路径>...</table>背景图片的URL=就是路径网址
<table border=边框大小>...</table>设定表格边框大小(使用数字)
<table bgcolor=颜色码>...</table>设定表格的背景颜色
<table borderclor=颜色码>...</table>设定表格边框的颜色
<table borderclordark=颜色码>...</table>设定表格暗边框的颜色
<table borderclorlight=颜色码>...</table>设定表格亮边框的颜色
<table cellpadding=参数>...</table>指定内容与格线之间的间距(使用数字)
<table cellspacing=参数>...</table>指定格线与格线之间的距离(使用数字)
<table cols=参数>...</table>指定表格的栏数
<table frame=参数>...</table>设定表格外框线的显示方式
<table width=宽度>...</table>指定表格的宽度大小(使用数字)
<table height=高度>...</table>指定表格的高度大小(使用数字)
<td colspan=参数>...</td>指定储存格合并栏的栏数(使用数字)
<td rowspan=参数>...</td>指定储存格合并列的列数(使用数字)
有很多自己需要的也可以再网上查找 这里有一个打包html 标签大全 失效http://115.com/file/dpa8u3rb# html标签属性大全.doc 大家学习愉快,相关技术指导贴也会开,敬请期待

回复

one262616回复给帖子:8598372

作者:one262616
好东西!!正需要!!!
查看回复

怎么看是不是用

作者:延陵柿子君
Nate 发表于 2012-6-9 16:41 怎么看是不是用Dw做的啊
这里是web前端从业者一只~ 一般专业规范的都是把样式单独写一个.css的文件,如果用DW的设计界面的话貌似都自动生成的样式都是在div的标签里的,后面会有个style=“……”这样的东西;感觉直接用DW的设计界面会生成很多冗余代码。。。 (其实我用DW也只用代码界面,基本没用过设计界面来着,以上只是个人体验下的判断) 然后,“html现在普遍都用软件做”这种说法不准确,DW也好notpad也好记事本也好都是属于软件,用啥都可以说是用软件来做;然后在行业内的话专业一点的普遍都还是直接写代码的,基本只有被赶鸭子上架的美工会选择直接用DW的设计界面
查看回复

ETA60sec回复给帖子:8598372

作者:ETA60sec
查看回复

相宅爱屋回复给帖子:8598372

作者:相宅爱屋
xueledian
查看回复

戳开看看

作者:里安城
戳开看看
查看回复

刚开始学习

作者:放烟花的青蛙
刚开始学习html,谢谢了
查看回复

涨姿势啦

作者:抱枕无忧
涨姿势啦~\(≧▽≦)/~
查看回复

哇我要的就这个

作者:KIUN
哇我要的就这个
查看回复
上一页
下一页
0%
站点地图友情链接:
喵宅苑
喵空间社区程序
喵宅苑 静态版
宅喵RPG地图编辑器
络合兔
Lanzainc
技术宅
小五四博客
莉可POI
Mithril.js
枫の主题社
Project1
午后少年
机智库
七濑胡桃
xiuno
幻想の日常
魂研社
Nothentai
0xffff
欲望之花
泽泽社长
淀粉月刊
HAYOU