首页 > 代码库 > 慕课html,css笔记(一)
慕课html,css笔记(一)
<ul>
<li>...</li>
<li>...</li>
</ul>
每项前都有一个小圆点。
<ol>
<li>...</li>
<li>...</li>
</ol>
每项前都有序号,默认从1开始。
<div>标签是能够批量化处理块内的元素,文档会被分为独立有个性的部分。
id属性为<div>提供唯一的名称。<div id="块的名称">...</div>
表格元素 table,tbody,tr,th,td
表格以<table>...</table>结束 <tbody>...</tbody>表格内容很多的时候等表格内容全部加载完后显示
<table>
<tbody>
<tr> <!--行标签-->
<th>...</th> <!--表格头部小组名-->
</tr>
<tr> <!--另一行-->
<td>...</td> <!--列标签,在th标签内容下-->
</tr>
</tbody>
</table>
没有添加css样式前是没有边框的。
css样式
<style type = "test/css">......</style>
<table summary="表格内容"> 这是摘要语法,不会在浏览器中显示,增加表格的可读性。
<table>
<caption>标题文本</caption>
</table>
<a href="http://www.mamicode.com/目标网址" title="鼠标划过时显示的文本" target="_blank">链接显示的文本</a>
a标签默认在当前窗口打开,target="_blank"属性在新窗口打开a标签
<a href="mailto:yy@imooc.com ?cc=xiaoming@imooc.com &bcc=xiaoyu@imooc.com &subject=主题 &body=邮件内容">链接显示文本</a>
mailto后有多个参数时,第一个参数以 ? 开头,后面的参数用 & 分隔。
<img src="http://www.mamicode.com/myimage.gif" alt="MyImage" title="My Image"/>相对路径下的插入图片
src:图像的位置 alt:当图片不见时,可以看到该属性指定的文本 title:(鼠标滑过图片时显示的文本)
文本,密码输入框:
<form>
<input type="text/password" name="名称" value="http://www.mamicode.com/文本" />
</form>
type="text"文本输入框 type="password"密码输入框 name:为文本框命名,以备后台程序ASP,PHP使用 value:提交给服务器的值
输入大量文字时,要用到文本输入域。<textarea rows="行数" cols="列数">文本</textarea>
单选,复选框 <input type="radio/checkbox" value="http://www.mamicode.com/值" name="名称" checked="checked">(radio单选 checkbox复选)
checked="checked" 默认被选中。同一组的单选按钮name取值一定要一致。
使用下拉列表框:
<select>
<option value="http://www.mamicode.com/看书">看书</option>
<option value="http://www.mamicode.com/旅游" selected="selected">旅游</option>
</select>
设置selected="selected"属性,选项默认选中。
<select multiple="multiple">实现多选功能 windows下,按下ctrl同时单击,可多选。
<input type="submit" value="http://www.mamicode.com/提交"> type的值设置为submit时,按钮才有提交作用。
<input type="reset" value="http://www.mamicode.com/重置">
css样式
css样式是选择符和声明组成,声明又由属性和值组成。 css注释:/*注释内容*/
p {color:red} 其中p是选择器,{}及其内容是声明,color是属性,red是值。 选择符=选择器,指明网页中要应用样式规则的元素。
css代码插入有内联式,嵌入式和外部式
内联式:<p style="color:red">红色</p>
css样式代码要写在style=" "双引号中,若多条css样式代码可写在一起,中间用分号。<p style="color:red;font-size:12px">文字</p>
嵌入式:把css样式代码写在<style type="text/css"></style>
比如:<style type="text/css">
span{color:red;}
</style> 而<style>在<head></head>之间
外部式:把css代码写在一个单独的外部文件中,以.css为扩展名,在<head>内(不在<style>内)
比如base.css是两一个文件的名称,其代码是 span{color:red;} 另一文件在<span>标签显示的文字会变红。css样式文件名称
除去base.css文件会有.html为扩展名的文件,在文件内<head>标签下有link标签<link href="http://www.mamicode.com/base.css" rel="stylesheet" type="text/css"/>
rel="stylesheet" type="text/css"是固定写法,不可修改。
这三种样式优先级是 离被设置元素越近优先级别越高。
慕课html,css笔记(一)