HTML
<body>标记的主要属性:
*bgcolor:设置页面背景颜色,如:bgcolor=”#CCFFCC”
*background:设置页面背景图片,如:background=”images/bg.gif” *bgproperties=”fixed”:使背景图片不随着滚动条的滚动而滚动 *text:设置文档正文的文字颜色,如:text=”#FF6666”
分段标记:<p>段落文字<p>正文标题:<h1>1号正文标题文字<h1>
<h2>2号正文标题文字<h2> <h3>3号正文标题文字<h3> <h4>4号正文标题文字<h4> <h5>5号正文标题文字<h5> 水平分隔线:<hr>
注释标记:<!—注释文字-->
文档头部信息: <title>:设置窗口标题
<link>:建立到外部文件(主要是CSS外部样式表)的链接 <link rel=”stylesheet” href=”mystyle01.css” type=”text/css”> <style>:设置网页的内部样式表
<meta>:设置当前页面的元数据信息
文本格式: <b>:粗体 <i>:斜体
<del>:文字中部划线表示删除 <ins>:文字下划线表示填充内容 <sub>:下标 <sup>:上标
<pre>:原样显示,保留空格和换行
字体:
<font>标记的属性: Face:设置字体类型 Size:设置字体大小 Color:设置字体颜色
列表: 有序列表: <ol type=”a”> <li>列表条目</li> <li>列表条目</li>
</ol>
无序列表: <ul> <li>列表条目</li> <li>列表条目</li> </ul>
表单:
<form action=”http://www.v512.com/bbs/login.jsp” method=”post”> 用户名:<input type=”text” name=”username”><br> 密码:<input type=”password” name=”psw”><br> <input type=”submit” value=”提交”> <input type=”reset” value=”重置”> </form>
action中的信息表示表单信息将提交到何处
method 中的信息表示表单信息上传到服务器的方式 表单组建:
单行文本输入框:<input type=”text” name=”age” value=”0”> 密码输入框:<input type=”password” name=”psw”>
单选按钮:<input type=”radio” name=”gender” value=”male” checked>男 <input type=”radio” name=”gender” value=”female”>女 提交按钮:<input type=”submit” name=”submit” value=”提交”>
CSS
Cascading Style Sheets
内嵌样式(Inline Style):以属性的形式直接在HTML标记中给出,用于设置该标记所定义信
息的现实效果
内嵌样式只对其所在的标记有效
<body style=”background-color;#coffee;”> <P style=”font-size:16px;color:red”>第一段文字</p> <P style=”font-size:italic;font-size:20px;color:#bb22cc”>第二段文字</p> </body>
内部样式表(Internal Style Sheet)
在HTML页面的头信息元素<head>中给出,可以同时设置多个标记所定义信息的现实效果 内部样式表只对所在的网页有效 <html>
<head> <style type=”text/css”> body{background-color:#coffee}
p.mystyle{font-size:20px;color:ble}}
p.mystyle{font-size:40px;color:#dd44aa;text-align:center} </style> </head> <body>
<p class=”mystyle1”>第一段文字</p> <p class=”mystyle1”>第二段文字</p> </body> </html>
外部样式表(External Style Sheet)
外部样式表将样式设置保存到独立的外部文件中,然后在要使用这些样式的HTML页面中进行引用
外部样式表为纯文本文件,后缀“.css” 外部样式表可被应用到多个页面中 m1.css如下:
body{background-color:#coffee} p.mystyle{font-size:20px;color:ble}}
p.mystyle{font-size:40px;color:#dd44aa;text-align:center} ex.html如下: <html>
<head><link href=”m1.css” rel=”stylesheet” type=”text/css”></head>
<body> <p class=”mystyle1”>第一段文字</p> <p class=”mystyle1”>第二段文字</p> </body> </html>
样式的优先级:内嵌样式、内部样式表、外部样式表、浏览器缺省样式
CSS基本语法:
CSS样式主要由三部分组成:选择器、属性名、属性值 例如:
P{color:#1166cc}
h2{text-align:center; color:red}
p.mystyle1{font-size:20px; color:blue}
DIV标记
DIV(division)是一个HTML标记,用于表示一块可现实HTML信息的区域 如果不适用任何CSS样式设置的话,div标记的效果与分段标记p基本相同 <div>第一段文字</div>
<div align=”center”>第二段文字</div>
使用CSS+DIV可以实现结构化的页面布局
HTML +CSS 标记语言主要属性
最新推荐文章于 2022-04-29 20:45:29 发布