java-HTML&javaSkcript&CSS&jQuery&ajax
CSS 伪装
1、<style>a;link{color:#000000}
a:visited{color:#000000;
a.:hover{color:#FF00FF}
a:active{color: #0000FF;}</style> <body><p><a href="/css" target="-blank"><>/a</p></body>
2、first-child伪类来选择元素的第一个子元素
<style>p:first-child{
color:blue;
}</style>
<body><p>第一行</p> <p>第二行</p> </body>
匹配第一个元素的<p>元素中的所有<i>元素
<style>
p>i:first-child{
color：blue;}</style>
<body> <p>I am is <i>strong</i>man <i>yes</i></p>
<p>I am is <i>strong</i>man <i>yes</i></p></body>
3、<style>p：first-line{
color:#ff0000;
font-variant:small-caps;}</style> <body><p>klKJDF</p></body>
4、文本首字母设置特殊样式
<style>p:frist-letter{
color:#ff0000;
font-size:xx-large;}</stylel>
<body> first a letter</body>
5、before元素添加首行的图片
<style>h1:before{
content:url(smiley.gif);}</style>
<body><h1>this is A haeading</h1></body> before 元素改成after就是在尾行添加图像
6、HTML导航栏设置
<body> <ur><li><a href="#home">主页</a></li>
<li><a href="#home">新网</a></li>
<li><a href="#home">联系方式</a></li>
<li><a href="#home">关于公司</a></li>
</ul></body> 这里要说明的是 # 这个标记就是指url测试，只是在按照url的形式反映出来，但不链接不能跳转
7、在列表中删除边距和填充
ul{ list-style-type:none; -------->移除列表前的小标志
margin:0;
padding:0;
} <body><ul><li><a href="#home">主页</a></li>
<li><a href="#home">新闻</a></li>
<li><a href="#home">联系</a></li>
<li><a href="#home">关于</a></li></ul></body>
8、垂直导航栏
<style>ul{
list-style-type:none;
margin:0;
padding:0;
width:20px;
background-color:#ffffff;
}
li a{
display:block;
color:#000;
padding:3px 23px;
text-decoration:none;
}
li a:hover{
background-color:#444;
color:white;
}</style>
<body>
<ul>
<li><a href="#home">主页</a></li></ul></body> 如果设置激活导航栏列 li a.active{ background-color:#444; color:white;}
设置水平导航栏 li{ display:inline;}
9、下拉菜单
<style>
.dropdown{
position:relative;
display:inline-block;
}
.dropdown-content{
display:none;
position:absolute;
background-color: #FFFFFF;
min-width:92px;
box-shadow:0px 3px 23px 23px egbz(0,0,0,2);
padding:12px 12px;
}
.dropdown:hover .dropdown-content{
display:block;
}</style>
<body><div class="dropdown"'>
<span>鼠标移动走到这里</span>
<div class="dropdown-content">
</body>
java-HTML&javaSkcript&CSS&jQuery&ajax的更多相关文章
- java-HTML&javaSkcript&CSS&jQuery&ajax( 八)
一.JavaScript教程笔记 1.在web页面中一般使用JavaScript脚本语言,支持跨平台,跨浏览器,驱动网页,与用户交互.另外Node.js把JavaScript引入到了服务器端. Jav ...
- XSS-HTML&javaSkcript&CSS&jQuery&ajax
1.设置不同的样式列表 <style> ul.a{list-style-tyrp:circle;} ul.b{list-style-type:square;} ul.c{list ...
- HTML&javaSkcript&CSS&jQuery&ajax（十）
HTML 1.SVG直接嵌入HTML网页 ,SVG 是使用XML描述2D图像的语言,Canvas通过JavaScript来绘制2D <svg xmlns="http://www.w3. ...
- HTML&javaSkcript&CSS&jQuery&ajax（八）
一. <!DOCTYPE html><html><head><meta charset="utf-8"><tiitle> ...
- HTML&javaSkcript&CSS&jQuery&ajax（七）
’一.HTML5 实例 <video width="430" controls> <source src="mov_nnn.mp4" t ...
- HTML&javaSkcript&CSS&jQuery&ajax（五）
一.Framset标签定义了每个框架中的HTML文档, 1. <framset cols="25%,75%"> <frame src="frame_a. ...
- HTML&javaSkcript&CSS&jQuery&ajax（四）
一.HTML创建响应设计 Responsive Web Design 可以改变尺寸传递网页,对于平板和移动设备是必须的 1.<!DOCTYPE html><html lang=&qu ...
- HTML&javaSkcript&CSS&jQuery&ajax（三）
一.HTML块元素 1.块级元素 Block level element ,内联元素 inline element , HTML<div>元素属于块级元素,他是组合其他HTML元素的容器, ...
- HTML&javaSkcript&CSS&jQuery&ajax（二）
一.HTML 1.标签<a href="http:www.baidu.com">This is a link </a> <img sr ...
随机推荐
- Javascript - ExtJs - 事件
事件(ExtJs Event) Ext.Util.observable类 Ext.Util.observable是一个接口,为Ext组件的事件提供了支持,组件的事件不同于传统事件,所以需要有这么一套 ...
- Battery historian安装及使用
在介绍Battery historian之前首先来介绍一下 Android adb bugreport 工具,bugreport是什么,怎么用? android系统想要成为一个功能完备,生态繁荣的操作 ...
- VMware虚拟机环境配置--网络配置
Hadoop集群搭建第一篇. 环境: VMware workstation 12, centos 6.5 配置虚拟机网络连接模式为NAT模式(共享主机的ip地址). 桥接模式: 和主机windows是 ...
- 数字图像处理的Matlab实现（4）—灰度变换与空间滤波
第3章 灰度变换与空间滤波(2) 3.3 直方图处理与函数绘图 基于从图像亮度直方图中提取的信息的亮度变换函数,在诸如增强.压缩.分割.描述等方面的图像处理中扮演着基础性的角色.本节的重点在于获取.绘 ...
- 判断HDFS文件是否存在
hadoop判断文件是否存在 在shell中判断一个HDFS目录/文件是否存在 直接看shell代码: hadoop fs -test -e /hdfs_dirif [ $? -ne 0 ]; the ...
- win7 vs2012/2013 编译boost 1.55
bjam install stage --toolset=msvc-11.0 --stagedir="C:\Boost\boost_vc_110" link=shared runt ...
- linux无法启动httpd服务问题
httpd 服务启动报错,可能出现的问题比较多,通过查看日志看是什么报错 (tail 200f /etc/httpd/logs/error_log) 1.查看防火墙是不是关闭状态 2.查看80端口是 ...
- Redis重大版本
Redis借鉴了Linux操作系统对于版本号的命名规则: 版本号第二位如果是奇数,则为非稳定版本(例如2.7.2.9.3.1),如果是偶数,则为稳定版本(例如2.6.2.8.3.0.3.2), 当前奇 ...
- hive学习02-累加
求出当月的访问次数,截至当月前的每个月最大访问次数.截至当月前每个用户总的访问次数. 数据表如下 A,-, A,-, B,-, A,-, B,-, A,-, A,-, A,-, B,-, B,-, A ...
- 练就Java24章真经—你所不知道的工厂方法
前言 最近一直在Java方向奋斗<终于,我还是下决心学Java后台了>,今天抽空开始学习Java的设计模式了.计划有时间就去学习,你这么有时间,还不来一起上车吗? 之所以要学习Java模式 ...