随手翻HTML+CSS笔记

最新推荐文章于 2022-12-13 10:34:42 发布

19年，重新开始写

最新推荐文章于 2022-12-13 10:34:42 发布

阅读量437

点赞数

分类专栏： html5+css3 文章标签： html css

本文链接：https://blog.csdn.net/qq_27905183/article/details/53154235

版权

html5+css3 专栏收录该内容

50 篇文章 0 订阅

订阅专栏

body：

1.设置整个页面的文字的默认颜色:<body text="颜色">
2.设置整个页面的连接默认颜色:<body link="初始化链接文字默认颜色" alink="正在访问的链接的文字的默认颜色" vlink="已访问过了的链接的文字的默认颜色">
3.设置整个页面相对浏览器的边距:<body topmargin/rightmargin/bottommargin/leftmargin>

meta：

1.设置页面编码：<meta http-equiv="content-Type" content="text/html;charset=gbk" />
2.设置页面所用语言:<meta http-equiv="language" content="zh_CN" />
3.页面的特效有:
    0.盒状收缩；
    1.盒状放射；
    2.圆形收缩；
    3.圆形放射；
    4.由下往上；
    5.由上往下；
    6.由左往右；
    7.有右往左；
    8.垂直百叶窗；
    9.水平百叶窗；
    10.水平格状百叶窗；
    11.垂直格状百叶窗；
    12.随意溶解；
    13.两端向中间展开；
    14.中间向两端展开；
    15.上下向中间展开；
    16.中间向上下展开；
    17.右上角向左下角展开；
    18.左下角向右上角展开；
    19.左上角向右下角展开；
    20.右下角向左上角展开；
    21.水平线状展开；
    22.垂直线状展开；
    23.随机一种方式
    实现进入某个页面时的过滤特效:<meta http-equiv="Page-Enter" content="revealTrans(Duration=持续时间 , Transition=特效索引)" />
    实现退出某个页面时的过滤特效:<meta http-equiv="Page-Exist" content="revealTrans(Duration=持续时间 , Transition=特效索引)" />
    实现进入某个网站时的过滤特效:<meta http-equiv="Site-Enter" content="revealTrans(Duration=持续时间 , Transition=特效索引)" />
    实现退出某个网站时的过滤特效:<meta http-equiv="Site-Exist" content="revealTrans(Duration=持续时间 , Transition=特效索引)" />
4.限制搜索引擎的搜索方式:<meta name="robots" content="搜索方式" />
    有六种搜索方式:
        all：页面将能被检索，并且页面中的网址也能被查询；
        none：页面不能被检索，并且页面中的网址也不能被查询；
        index：页面能被检索，但是页面中的网址不能被查询；
        follow：页面不能被检索，但是页面中的网址能被查询；
        noindex：与index刚好相反；
        nofollow：与follow刚好相反；

排版属性：

1.<hr width="水平线宽度" size="水平线高度" color align="对齐方式" noshade去掉阴影 />
2.<nobr>...</nobr>标签内的文本不会换行
3.<blockquote>...</blockquote>标签内的文本会向右缩进一次，该标签可以嵌套
4.<font face color size>...</font>
5.<u>下划线文本</u>;<strike>删除线文本</strike>
6.<ol type="序号类型" start="开始数值（不管序号类型为什么，开始数值都为阿拉伯数字）>
    有序列表的序号类型：
        1.表示阿拉伯数字
        a.表示小写字母、
        A.表示大写字母
        i.表示罗马数字i,ii,iii,iv,v...
        I.表示大写罗马数字I,II,III,...
    无序列表的序号类型：
        disc：实心圆
        circle：空心圆
        square：方形
7.菜单列表:<menu><LI>...</LI></menu>用法同无序列表
8.目录列表:<dir><LI>...</LI></dir>用法同无序列表
9.图像热点超链接：
    <img src usemap="mapName" />
    <map name="mapName">
        <area sharpe="形状" coords="..." href="该区域的链接" />
    </map>
    形状有:
        rect：这时候coords需要指出左上角坐标和右下角坐标
        circle：这时候coords需要指出圆心坐标和圆的半径
        poly：多边形，这时候coords需要指出所有的点的坐标
10.锚点：1.定义:<a name="锚点名称">...</a>
        2.使用:<a href="#锚点名称">...</a>
        3.使用不同的文件的锚点:<a href="文件url地址#锚点名称">...</a>
11.定义滚动文字:<marquee direction="top/right/bottom/left" behavior="scroll/alternate/slide" loop="循环次数" bgcolor="背景颜色" width height scrollamount="滚动速度" scrolldelay="滚动延迟" hspace/vspace="距离页面多远停止滚动">...</marquee>
12.设置页面的背景音乐:<bgsound src loop="true/false" />

table:

1.<table cellspacing="单元格间距" cellpadding="单元格内边距" bgcolor="表格背景颜色" background="表格背景图片" align="单元格里的内容的对齐方式">...</table>
2.<td rowspan="横跨多少行" colspan="纵跨多少列" nowarp)单元格里的内容不换行)>...</td>
3.一个table表格标签里只能有一个<thead>/<tbody>/<caption>/<tfoot>

form：

1.单选框定义:<input type-"radio" name="regex" checked />
2.复选框定义:<input type="checkbox" name="favorite" checked" />
3.图像按钮定义:<input type="image" src="图像地址" />
4.下拉列表:<select size="显示的列个数" multiple(允许重复选)>...</select>

CSS样式:

1.font-variant：normal/small-caps:用于将内容中的字母全部转换成大写
2.text-transform：none/capitalize/uppercase/lowercase：用于将内容中的字母进行相应转换，分别为:不转换、首字母大写、全部转换成大写、全部转换成小写
3.word-spacing：设置单词之间的间隔；letter-spacing：设置字符之间的间隔
4.vertical-align：设置垂直方向上的文本对齐方式，有:baseline：相对于上级元素的基线对齐；sub/super：相对上级元素的下、上标对齐；...
5.direction：设置文本的显示方式，分别有:ltr：从左往右显示文本；rtl：从右往左显示文本；inherit：继承父元素的显示方式
6.z-index：定义层叠优先级，优先级越高的覆盖优先级低的
7.当页面处于滚动模式或者某位置出现滚动模式时，可设置其三个属性，以页面滚动模式为例：
    html{
        scroll-face-color：滚动条滑块的颜色
        scroll-arrow-color：滚动条上下三角形的颜色
        scroll-track-coloe：滚动条拖动区颜色
    }