<%@ page contentType="text/html; charset=UTF-8"%> <% String contextPath = request.getContextPath(); %> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>CSS 样式Test</title> <link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/pages/excel/cssTest.css"> </head> <body> <%-- <div class="event_left_tl"> <div class="fullchose"> <input class="eventcheckbox" type="checkbox" name="" value="" /> <span>全选</span> </div> </div> <div class="modal-content-row modal-content-row-btna"> 带空格的Class ID </div> <div class="modal-content-row modal-content-row-btna"> <div class="add-black-yes-btn ssssss">确 认</div> </div> --%> <div class="div-top"> Top</div> <div class="div-upper">2</div> <div class="div-bottom">3</div> <div class="div-left"> <div class="div-left2">s</div> </div> <div class="div-rigth">5-宽度70% DIV 居中</div> <div class="div-6"> <div class="div-6-1">6-1</div> <div class="div-6-2">6-2</div> <div class="div-6-3">6-3</div> </div> <div class="div-7"> <div class="div-7-1">7-1</div> <div class="div-7-2">7-2</div> </div> <script type="text/javascript" src="<%=request.getContextPath()%>/pages/excel/cssTest.js"></script> </body> </html>
@charset "utf-8"; body { overflow-y: hidden; background: #0c0c0c; } .event_left_tl .fullchose .eventcheckbox { margin: 8px 16px 0 7px; width: 18px; } /**选取 event_left_tl 下的子 ID .fullchose 下的 span 标签 **/ .event_left_tl .fullchose span { font-size:15px; } /**<div class="modal-content-row modal-content-row-btna"> 放modal-content-row modal-content-row-btna无法选的取, 可以放modal-content-row 或 modal-content-row-btna进行选取**/ .modal-content-row-btna{ font-size:20px; } .modal-content-row-btna{ margin-top: 0; } .add-black-yes-btn { background-color: rgba(0, 0, 0, 0); background-position: 0 -1434px; background-repeat: no-repeat; color: #fff; cursor: pointer; float: left; font: 12px/36px "Microsoft YaHei"; height: 37px; margin-right: 6px; text-align: center; text-shadow: 0 0 4px #a91717; width: 162px; } .div-top { width: 100%; height: 180px; background: none repeat scroll 0 0 #FFFF00; } .div-upper { width: 286px; height: 180px; padding: 15px 1 0 20px; background:#ff0000; /* background-image: url("../../images/login/login_wrap_bg.png"); */ /* background-repeat: repeat-y; 属性设置是否及如何重复背景图像。*/ position: absolute; top: 20px; left: 900px; } .div-bottom { width: 100%; height: 100px; background: none repeat scroll 0 0 #0000FF; } .div-left { width: 100%; height: 100px; background: none repeat scroll 0 0 #ececec; } .div-left2 { width: 50%; height: 100px; overflow: hidden; float: right; background: none repeat scroll 0 0 #FF00FF; } .div-rigth { width: 70%; height: 100px; margin: 0 auto; /* div居中 */ padding-top: 50px; overflow: hidden; background: none repeat scroll 0 0 #ff0000; } .div-6{ width: 100%; height: 100px; padding-top: 30px; /* 设置元素的上内边距(空间) */ overflow: hidden; background: none repeat scroll 0 0 #00FF00; } .div-6-1 { width: 30%; height: 100px; overflow: hidden; float: left; background:#ff0000; } .div-6-2 { width: 30%; height: 70px; overflow: hidden; float: left; background: none repeat scroll 0 0 #000000; position: absolute; left: 500px; } .div-6-3 { width: 30%; height: 100px; overflow: hidden; float: right; background: none repeat scroll 0 0 #0000FF; } .div-7{ width: 100%; height: 100px; padding-top: 0px; /* 设置元素的上内边距(空间) */ overflow: hidden; background: none repeat scroll 0 0 #00FF00; } .div-7-1 { width: 50%; height: 100px; overflow: hidden; float: left; background:#C0C0C0; } .div-7-2 { width: 50%; height: 100px; overflow: hidden; float: left; background:#FF0000; }
$(function() { //<div class="add-black-yes-btn ssssss">确 认</div> 选取时写 add-black-yes-btn ssssss无效, 能写 add-black-yes-btn 或 ssssss $(".ssssss").click(function(){ alert("确定 !"); }); }); function addBlackOnly(){ alert('Say Hello'); }