------- android培训、java培训、期待与您交流! -------- ----Html---- 1、创建 Dreamweaver 8---创建Html------代码 2、标签: <html> <head> <title>hello html</title> 设置编码方式 </head> head和body平级 <ul> <li></li> </ul> <ol> </ol> <pre> </pre> <body> 网页内容<br><p> ABCDEFGH<font>IGKLMNO</font>PQRSTUVWXYZ </body> </html> <br> 换行标签 <p> 换段标签 <font color="" size="+5"></font> 改变范围内字体 <img src="图片相对路径" width="200" height="200" alt="123"/> alt:提示信息 <body bgcolor="" bg> gcolor是body的属性颜色 空格标签 "XXXX" 引号 <XXXX> <XXXX> © 版权符号 © <ul></ul> 列表符号 <li></li> 无序列表 <ol></ol> 有序列表 <ul type="square"> 以方格列表 <ol type="i"> 以阿拉伯字符列表 <pre></pre> 域文本格式标签 <!--XXXX--> 加注释 <imp src="1.bmp" align="top"/>XXXX 字和图片对齐 <div>XXXX</div> 容器标签 <div align="位置"> 容器在网页的位置 <h1 align="left">XXXX</h1> <h2>XXXX</h2> 标题标签依次递减 <h3>XXXX</h3> <h4>XXXX</h4> <marquee direction="down" scrolldelay="10" οnmοuseοver="this.stop()" οnmοuseοut="this.start()">XX</marquee> 滚动标签 direction滚动方向 scrolldelay速度 <a href="XXX">XXX</a> 超链接标签 <a name="top">backtop</a> 返回连接标志 <a href="#top">返回顶部</a> 返回XXX超级链接 <a href="1.html#buttom"></a> 跨网页链接 <a href="mailto:1234@qq.com"></a> <hr color="" width="50%" size="10"> 画线 width在屏幕多少 size粗细 表格: <table border="1" align="center"> border边框 <tr> <td></td> 列 </tr> 行 </table> <td colspan="4" align="center"> 行合并 <td rolspan="3"> cellpadding="" 内容到边框的距离 cellspacing="" 边框到边框的距离 表单 : <form></form> <input type="text" name="昵称" value="默认值" /> 输入文本框 <input type="radio" name="sex" value="男" />男 <input type="radio" name="sex" value="女" />女 单选按钮 <input type="checkbox" name="hobby" value="eat">吃 复选框 <input type="checkbox" name="hobby" value="sleep">睡 <input type="checkbox" name="hobby" value="eat">喝 <input type="button" name="sava" value="提交"> 普通按钮 <input type="submit" ....> 提交按钮 <input type="reset" name="reset" value="重置"> 重置按钮 <select name="province"> 下拉列表 省份 <option value="陕西省">陕西省</option> <option value="山东省">山东省</option> <option value="河南省">河南省</option> 城市 <option value="西安">西安</option> <option value="北京">北京</option> <option value="天津">天津</option> </select> <textarea cols="40" rows="3" name="info"></textarea> 文本框 <input type="file" name="userface" /> 头像上传 框架 : 不要<body> 放<frameset>面板集合 <frameset rows="50,*"> <frame src="加网页" name=""/> 设置名字 <frame src=""/> </framest> <a href="1.html" target="right">1.html</a> 超链接显示到右边 ----------------------------------------------------------------------------------------------------------------------- CSS <style type="text/css"> css样式 text样式修饰 p{ 样式选择器-标签样式 font-size: 24px; 尺寸 font-style: italic; 类型(斜体 粗体) font-family: "楷体_GB2312"; 字体 color: #996600; 颜色 font-weight: bolder; } .xy{ 类样式 font-size: font-style: font-family: font-weight: color: } <p class="xy"> 调用... .bg{ 类表格样式 background-color: background-image: width: height: backgroud-repeat: repeat-x; 按x轴平铺背景 } .tab{ 类表格内容样式 background-image: text-align: width: height: vertical-align: } td{ 标签样式 vertical-align:bottom; text-indent: text-transform: capitalize; line-height: letter-spacing:0.2cm; 字符间距 } .btn{ 类按钮样式 background-color; background-image: font-size: color: 字体颜色 width: height: border: 0px; 按钮边框 } 伪类 超链接样式 共4种 a:link{ 初始样式 color: text-decoration:none; 下划线 font-family: "宋体" font-style:italic; 斜体 } a:hover{ 鼠标放上去时样式 color: } a:active{ 鼠标点下去时样式 color: } a:visitored{ 访问过后样式 color: } 边框样式 边框--对象 距离 padding 边框 距离 border 边框--边界 距离 margin margin-top: table内 margin-left: padding: td内 border: table内-外边框 td内-内边框 .f{ 使之包围起来 float:left; cursor: 鼠标样式 } .ul{ 列表样式 list-style-type: 符号样式 list-style-image: display:block; 隐藏none 显block list-style-position: inside; } 外部样式表文件 建立XX.CSS文件 <link href="XX.css" rl="stylesheet" type="text/css" /> 连接网页 按照应用范围分为3类样式: 内嵌样式、行内样式、外部样式表 div分层 id样式 <style type="text/css"> #div1{ background-color: width:100%; height:150px; } #div2{ background-image: } </style> <div id="div1"></div> <div id="div1"></div>
黑马程序员 04 Java WEB学习笔记< HTML & CSS >
最新推荐文章于 2024-05-26 22:09:24 发布