class0513(html)

精通DIV+CSS

Meta

1、div span

2、三种样式表

内联样式(行内样式)
嵌入样式
外部样式

就近原则

3、常见样式
复合样式background border
css单位 % px em
background-color
color
border-style
border-width
border-color
display:none、block块、inline内嵌
cursor
list-style-type:none
float
clear 清除浮动
margin 间距
padding 填充
position 相对 绝对 固定
帮助

4.样式选择器

标签选择器 input

类选择器 .class

id选择器 #wrap

标签+类选择器

*包含选择器p strong

*组合选择器 h1,h2,input{}

伪选择器 为标签的不同状态设定样式

5.表格的细边框

6.ul做菜单

7.布局

    表格布局

    框架布局

   div+CSS布局

作业:
表格细边框
ul做菜单
div+css做布局

让导航显示到右边
三栏的布局

html部分

1、html基本结构 html---超文本标记语言
<html>
<head>
<title>我的第一个网页</title>
</head>
<body bgcolor="red" background="bg.jpg">
</body>
</html>
2、文本相关标签
<H1> - <H6> 标题
<font> color size face 控制字体 颜色 大小 样式(宋体,楷体)以后基本不用用css
<p> align <br> 段落 换行
<center> <b> <i> 居中 加粗 斜体
<hr> 水平线
<pre> 预格式文本,让文本保持原来风格,英雄本色
特殊字符
&nbsp; &lt; &gt; 空格 左尖括号 右尖括号
3、超链接
<a> href target="_blank"
绝对路径 写死了
相对路径
上一级目录../
根路径/

锚定 <a name="top">顶部</a>

<a href="#top" name="top">回到顶部</a>
4、图像
<img> alt src width height border title src路径 border边框 alt鼠标放上去显示alt的文本值。
5、列表
<ul> type=disc, circle, square 导航栏,新闻标题
<ol> type=1,a,A,I,i
6、表格
<table> align valign rowspan colspan rowspan跨行 colspan跨列
cellpadding填充 cellspacing间距 border bordercolor

7、表单
<form> method
表单元素
<input> type=submit reset button image checkbox radio text password hidden file hidden隐藏按钮给程序员用的 file按钮主要是用于
<textarea>
<select>列表
<label>
* b/s browser / server

8、<fieldset> <legend>
9、<meta>
10、注释 <!-- 注释的内容 -->
* <embed src="coder.mp3" loop=true autostart=true name=bgss width="460" height="68">调用wmp的插件
* <bgsound src="town.mid" loop="true" />只能播放wav和mid格式,只支持ie

* 插入flash

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="760" height="700">
<param name="movie" value="light-bot-2205.swf" />
<param name="quality" value="high" />
<embed src="light-bot-2205.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="760" height="700"></embed>
</object>


* 滚动标签 <marquee> scrolldelay direction


遗留问题:
1、text和password不一样长
2、无法改变button的长度
3、table的的边框太粗 table内文字样式

 

class0513(html),布布扣,bubuko.com

class0513(html)

上一篇:php口试题


下一篇:ASP.NET MVC基于标注特性的Model验证:一个Model,多种验证规则