'WebPrograming'에 해당되는 글 15건
- 2012.09.24 [정보] jquery.validator 정리
- 2012.09.07 Web 개발자를 위한 jQuery 총 모음
- 2012.06.11 뒤로가기 방지
- 2012.04.10 네이버 스마트 에디터에 이미지 삽입 기능 추가
- 2012.03.29 JSP 달력(CSS적용) 2
jquery 플러그인 중 하나인 jquery.validator 의 옵션을 분석(해석?)해 본 겁니다.
뭐 별 쓸데도 없는 문서지만 기왕 정리한거 저 같이 영어레벨이 쎄멘바닥인 분들한테는 조금이나마 도움이 될까 하여 올려봅니다.
스프링노트에 적어두었던걸 그대로 옮긴거라 경어가 아닌점 양해바랍니다.
중간 중간 몰라서 분석 못한것도 있구요 잘못된 부분이 있을지도 모릅니다. ㅠㅠ 말씀해 주시면 수정하겠습니다.
jquery.validator
Option 정리
기본값: false
디버그 할 수 있도록 입력값이 유효해도 submit 하지 않는다
$(".selector").validate({
debug: true
})
폼이 submit 될때 마지막으로 뭔가 할 수 있도록 핸들을 넘겨준다.
$(".selector").validate({
submitHandler: function(form) {
$(form).ajaxSubmit();
}
})
입력값이 잘못된 상태에서 submit 할때 자체처리하기전 사용자에게 핸들을 넘겨준다.
<arguments>
form
validator
유효성검사에서 제외할 Element를 지정한다.
$("#myform").validate({
ignore: ".ignore"
})
체크할 항목들의 룰을 설정한다.
$(".selector").validate({
rules: {
// simple rule, converted to {required:true}
name: "required",
// compound rule
email: {
required: true,
email: true
}
}
})
$(".selector").validate({
rules: {
contact: {
required: true,
email: {
depends: function(element) {
return $("#contactform_email:checked")
}
}
}
}
})
무효한 필드일때 왜 무효한지 설명하는 메세지를 설정한다.
$(".selector").validate({
rules: {
name: "required",
email: {
required: true,
email: true
}
},
messages: {
name: "Please specify your name",
email: {
required: "We need your email address to contact you",
email: "Your email address must be in the format of name@domain.com"
}
}
})
$(".selector").validate({
rules: {
name: {
required: true,
minlength: 2
}
},
messages: {
name: {
required: "We need your email address to contact you",
minlength: jQuery.format("At least {0} characters required!")
}
}
})
다수의 Element를 그룹을 지어서 한쪽에서 에러메세지를 보여준다.
임의의 위치를 설정하기 위해서는 errorPlacement 안에서 할 수 있고 따로 설정이 없을경우 지정한 마지막 엘리먼트끝에 출력된다.
$("#myform").validate({
groups: {
username: "fname lname"
},
errorPlacement: function(error, element) {
if (element.attr("name") == "fname"
|| element.attr("name") == "lname" )
error.insertAfter("#lastname");
else
error.insertAfter(element);
},
debug:true
})
유효성체크 없이 무조건 submit 한다
$(".selector").validate({
onsubmit: false
})
기본값 : true
포커스가 떠날때 유효성 검사를 한다. onkeyup도 false가 되어 있어야 눈으로 체감할 수 있다.
$(".selector").validate({
onfocusout: false
})
기본값 : true
키를 뗄때 유효성검사를 한다.
$(".selector").validate({
onkeyup: false
})
기본값 : true
checkbox 와 radio 버튼이 클릭될때 유효성 검사를 한다.
$(".selector").validate({
onclick: false
})
기본값 : true
유효성 검사 후 포커스를 해당 무효필드에 둘 것인가 여부
$(".selector").validate({
focusInvalid: false
})
기본값 : false
true 로 설정되어 있을 경우 잘못된 필드에 포커스가 가면 에러메세지를 지운다
$(".selector").validate({
focusCleanup: true
})
엘리먼트에 class="..." 형식으로 지정하려고 하는데 다른 플러그인과 겹칠경우 이를 {[이름]{옵션1, 옵션2}} 와 같이 싸서 이용할 수 있도록 한다 (이건 정확한건지는 모르겠음)
$("#myform").validate({
meta: "validate",
submitHandler: function() { alert("Submitted!") }
})
HTML : <input type="text" name="email" class="{validate:{ required: true, email:true }}" />
기본값 : error
에러메세지의 CSS 클래스이름을 설정한다.
기본값은 .error 로 출력되는데 이 class 명을 바꿀 수 있다.
예를 들어 기본값일 경우에는 CSS 정의에서
.error{color:#00f}
이런식으로 사용할 수 있는데 만약 class 명을 invalid 라고 바꿨다면
.invalid{color:#00f}
라고 사용할 수 있다.
$(".selector").validate({
errorClass: "invalid"
})
유효성체크에서 성공한 값들의 클래스이름을 설정한다.
errorClass 와 같은 개념이다.
$(".selector").validate({
validClass: "success"
})
에러메시지를 출력하는 엘리먼트의 태그요소를 결정한다.
errorClass의 개념과 같으나 HTML 태그를 바꾼다.
$(".selector").validate({
errorElement: "em"
})
에러 메세지들을 임의의 태그로 묶는다.
만약 에러메세지들이 아래와 같이 생성되었다면
<label class='error'>This field is required</label>
<label class='error'>Your lastname, please!</label>
wraper:'li' 라고 했을때
<li>
<label class='error'>This field is required</label>
<label class='error'>Your lastname, please!</label>
</li>
로 묶어버린다. 이 기능은 주로 errorLabelContainer 와 같이 사용된다.
$(".selector").validate({
wrapper: "li"
})
에러메세지들의 해당 무효필드 옆에 보여주는게 아니라 한곳에 묶어 보여줄때 이용된다.
출력을 원하는 위치의 엘리먼트 아이디를 써주면 된다.
$("#myform").validate({
errorLabelContainer: "#messageBox",
wrapper: "li",
submitHandler: function() { alert("Submitted!") }
})
기존 상세 에러메세지 외에 대표적 에러메세지를 보여줄때 사용한다.
예를 들어 아래와 같다.
아이디 : 아이디가 입력되지 않았습니다. <== 기존 상세에러메세지
비밀번호 : 비밀번호가 입력되지 않았습니다 <== 기존 상세에러메세지
***************************************************************
입력폼에 에러가 있습니다. 입력폼을 다시 확인하세요 <== 이 부분에 해당
***************************************************************
지정한 상세에러메세지가 모두 사라질 때까지 이 메세지는 사라지지 않는다.
errorContainer 로 선언한 것 중 errorLabelContainer 로 선언되지 않은 것이 이에 해당한다.
해당되는 메세지는 자동으로 입력되는 메세지가 아니다. 이건 원본의 데모페이지를 봐야 이해가 가능할거 같다.
http://docs.jquery.com/Plugins/Validation/validate 여기서 Options 탭을 눌러 검색
에러처리를 하기전에 사용자에게 핸들을 넘겨준다. 그러므로 에러처리를 override 하거나 선행처리할 때 사용할 수 있다. 맨아래 팁이 이걸 응용한거다.
$(".selector").validate({
showErrors: function(errorMap, errorList) {
$("#summary").html("Your form contains "
+ this.numberOfInvalids()
+ " errors, see details below.");
this.defaultShowErrors();
}
})
기본값 : 무효한 필드 바로 뒤
에러 메세지의 위치를 지정할 수 있다. 이건 실험을 안해봤음. 뭐 되겠지 ^ ^;
$("#myform").validate({
errorPlacement: function(error, element) {
error.appendTo( element.parent("td").next("td") );
},
debug:true
})
이건 validClass 하고 똑같은 효과던데 차이가 뭔지 잘 모르겠다. 나중에 알아봐야겠다.. ㅜㅜ
$("#myform").validate({
success: "valid",
submitHandler: function() { alert("Submitted!") }
})
기본값 : errorClass 를 추가시킨다
필드가 Invalid 됐을때 어떻게 하이라이트 시킬까를 결정할 수 있다.
예를 들어 아래와 같이 페이드 인, 아웃 효과를 주는것도 가능하다 ^^
$(".selector").validate({
highlight: function(element, errorClass) {
$(element).fadeOut(function() {
$(element).fadeIn();
});
}
})
기본값 : errorClass 를 제거한다.
highlight 된걸 다시 되돌릴때 무엇을 할까를 지정할 수 있다.
아규먼트는 highlight하고 동일하다.
별 필요없는 거 같다. 뭐 제거될거란 이야기인가? ㅋ 사실 잘 모르겠다 ㅜㅜ
$(".selector").validate({
ignoreTitle: true
})
※ 팁 : invalidate 할때 페이지에 메세지를 뿌리는게 아니라 기존방식대로 경고창(alert)으로 띄우고 싶다면 아래처럼 옵션을 주면 된다.
클라이언트들이 구식방식을 선호할때가 있음 -_-;;;
jQuery.validator.setDefaults({
onkeyup:false,
onclick:false,
onfocusout:false,
showErrors:function(errorMap, errorList){
var caption = $(errorList[0].element).attr('caption') || $(errorList[0].element).attr('name');
alert('[' + caption + ']' + errorList[0].message);
}
});
< input type="text" name="mb_name" caption="이름" class="required" /> caption 은 임의로 정한 attribute 명입니다. caption="이름" 이런식으로 주면 됨
http://phpschool.com/gnuboard4/bbs/board.php?bo_table=tipntech&wr_id=72358
'WebPrograming > Jquery' 카테고리의 다른 글
| jQuery 플러그인 xml 을 json 객체로 변환 (0) | 2013.05.11 |
|---|---|
| Jquery, location.href, 페이지 이동 (1) | 2013.03.20 |
| [Java Script] Java Script 암호화(Packer) (0) | 2012.11.22 |
| jQuery Ajax - getJSON예제[실습] (0) | 2012.10.26 |
| Web 개발자를 위한 jQuery 총 모음 (0) | 2012.09.07 |
[Design] - 웹디자인용 40가지 무료 Social Media Icon들
[Design] - 디자인 영감을 불어넣는 엄선된 웹 디자인 모음
[Awesome things] - 웹 디자이너들에게 영감을 줄 수 있는 Single-page 웹사이트 9개
jQuery is a great and powerful tool, and every web developer should use it. One of the problems is that when you don’t know how to create something in jQuery, you start searching for solutions on the web and you’ll lose a lot of time doing it. The main advantage of a toolbox is that you have everything(uh, or almost) that you need in a single place, and with this thing in mind I have created this post. In this article you have almost every jQuery plugins that need when designing a web application. I hope you’ll like it.
Charts and Presentations
jQuery Sparklines
This jQuery plugin generates sparklines (small inline charts) directly in the browser using data supplied either inline in the HTML, or via javascript.
jqChart – HTML5 jQuery Chart Plugin
Draws charts and graphs with modern and minimal code. Cross-browser support – works with IE 6+, Firefox, Google Chrome, Opera, Safari.
Arbor
Arbor is a graph visualization library built with web workers and jQuery. Rather than trying to be an all-encompassing framework, arbor provides an efficient, force-directed layout algorithm plus abstractions for graph organization and screen refresh handling.
Wijmo jQuery UI Widgets
Wijmo is a complete kit of over 30 UI widgets with everything from interactive menus to rich charts. If you know jQuery, you know Wijmo. Complete with documentation and professional support, every widget is hand-crafted and includes premium themes.
Sliders and Accordions
Slider Kit
The purpose of Slider Kit is to gather common slideshow-like jQuery functionalities (such as news sliders, photos galleries/sliders, carousels, tabs menus) into one lightweight and flexible plugin combined with ready-to-use CSS skins.
Awkward Showcase
Awkward Showcase is a plugin for the JavaScript Framework jQuery. We call it a Content Slider. But it can do more then just slide the content. For example you can add tooltips, enable thumbnails, activate dynamic height and lots more.
Horinaja
Horinaja is a ready-to-use slide-show implementation, utilizing either scriptaculous/prototype or jQuery. Horinaja is innovative because it allows you to use a mousewheel for navigation. When the mouse is outside of the slide-show area, it scrolls. When hovering over the slide-show, the scrolling pauses.
Feature List
Simple and easy creation of an interactive “Featured Items” widget.
slideIO – A Simple In/Out Slideshow
This is a simple jQuery slideshow plugin based on one effect: sliding in and out (well, it also does a fade if you want).
Smooth Div Scroll
Smooth Div Scroll is a jQuery plugin that scrolls content horizontally left or right. Apart from many of the other scrolling plugins that have been written for jQuery, Smooth Div Scroll does not limit the scrolling to distinct steps. As the name of the plugin hints, scrolling is smooth. There are no visible controls (unless you want to) since the scrolling is done using hotspots within the scrollable area or via autoscrolling.
Alert Windows and Prompts
Apprise
An alert alternative for jQuery that looks good. Apprise is a very simple, fast, attractive, and unobtrusive way to communicate with your users. Also, this gives you complete control over style, content, position, and functionality. Apprise is, more or less, for the developer who wants an attractive alert or dialog box without having to download a massive UI framework.
jReject: jQuery Browser Rejection
Reject provides a simple, robjust, light-weight way to display rejections based on a the browser, specific browser version, specific platforms, or rendering engine. Provides full customization of the popup. Uses no CSS file (by default), and can easily be used on page load or during a specific page events. Also provides a flexible way to display custom browser alternatives in the popup.
jQuery MSG Plugin
Back in the old days we use‘alert(‘blah blah’);’ to show users a message or a warning.It is functionable but not pretty. So I used to use BlockUI instead.Later on I found out I don’t need all the features it has and I want it to beeasiler to customize. So I write my own simpler version called MSG.It can only block the whole window, it has theme suuport, afterBlock and beforeUnblockevent, … etc, and it’s only 4 kb uncompressed with code comments.
Subscriber Traffic Pop
Subscriber Traffic Pop is the hottest new way to gain newsletter, email list subscribers in high volume with no work. The revolutionary Traffic Pop idea has been extended into a whole new category with email subscriptions!
Color Pickers
Color Picker – jQuery Plugin
A simple component to select color in the same way you select color in Adobe Photoshop.
jQuery color plugin xcolor
The xcolor plugin is an easy-to-use jQuery extension to manipulate colors in all imaginable combinations. This plugin implements an extensiv color parser and a featureful set of color-manipulation methods. There is also an animate() extension to smooth CSS colors. Another useful method isReadable() completes the whole, by allowing you to check if a text is readable on a certain background. The color value can also be passed in different color models: RGB, HSV/HSB, HSL and their adequate alpha extensions.
HeatColor
HeatColor is a plugin that allows you to assign colors to elements, based on a value derived from that element. The derived value is compared to a range of values, either determined automatically or passed in, and the element is assigned a “heat” color based on its derived value’s position within the range.
Drag and Drop
DragSoft
A lightweight javascript file that provides the ability to sort lists using drag and drop. Built on the jQuery framework.
easyDrag jQuery Plugin
EasyDrag is a plugin aimed to provide a simple way of adding drag-and-drop functionality to DOM elements. It features the ability to set functions to be called on drag and on drop events.
Form Validation
Credit Card Validation
Here’s an improved credit card validation extension for the jQuery Validation plugin. This lets you pass the credit card type into the validation routine, which allows it to do card type specific checks for prefix of the card number and number of digits. This extension includes the mod-10 check (based on the Luhn Algorithm) that is used in the core creditcard validation routine. As an extra bonus, it will ignore spaces and dashes in the card number. This code was ported from this credit card validation routine by John Gardner, with some minor tweaks and additions.
jFormer
jFormer is a form framework written on top of jQuery that allows you to quickly generate beautiful, standards compliant forms. Leveraging the latest techniques in web design, jFormer helps you create various web forms.
Ajax Fancy Captcha
Ajax Fancy Captcha is a jQuery plugin that helps you protect your web pages from bots and spammers. We are introducing you to a new, intuitive way of completing “verify humanity” tasks. In order to do that you are asked to drag and drop specified item into a circle.
jQuery slideLock Plugin
slideLock adds a jQuery UI slider along with labels and notes to any form you wish as an alternative to traditional CAPTCHA. The user simply slides the form to unlock the submit button and then both client side and server side validation techniques ensure secure submission of the form.
jQuery validVal
jQuery.validVal is a plugin designed to simplify form validation. It is highly customizable, very feature rich and can easily be dropped on any type of HTML-form (even AJAX- and HTML5-forms) with very little effort.
Inline Edit and Editors
CLEditor
CLEditor is an open source jQuery plugin which provides a lightweight, full featured, cross browser, extensible, WYSIWYG HTML editor that can be easily added into any web site.
jQuery CodeExplorer Plugin
CodeExplorer is an enitrely unique code formatting plugin that will not only format the code with colors and spacing, but will also display it in an entire folder structure.
RapidEdit
The RapidEdit plugin makes it possible to edit any content on your website without reloading the page even once. The plugin provides a simple edit-link on elements marked with the class ‘editable’ (this is the default class, can be changed) which replace the content of the element with a textarea, where the content can be edited, when clicked. To make the plugin as customizable as possible, loads of settings are provided so you can change it to fit your needs and it also supports the MetaData plugin and the WYSIWYG-editor TinyMCE.
Rating Plugins
jRating
Rating is a very flexible jQuery plugin for quickly creating an Ajaxed star rating system. It is possible to configure every detail from” the number of the stars” to “if the stars can represent decimals or not”. There is also an option to display small or big stars and images can be changed with any other file easily.
jQuery Opineo Plugin
Opineo allows you to do all of this and much more without signing up for an account or hire an expert. This DIY tool enables you to listen to your customers’ voice easily and instantly. All you have to do is go online, design your widget and place it on your website.
Social Bookmarking
Twitter Friends Widget
There is a Facebook fans widget, Google friends widget, what about a Twitter friends widget?! Here is a jQuery plugin that you can embed anywhere to display pictures of your Twitter followers or friends (whom you follow) and their latest tweets if you like.
A jQuery Twitter Ticker
A pure jQuery & CSS twitter ticker which utilizes Twitter’s Search API. It will show your or your friends’ latest tweets, and will not require any server side code or databases. As a result, the ticker will be easily included into any web page and easily modified to your likings.
jQuery LiveTwitter
LiveTwitter is a lightweight, realtime updating Twitter plugin for jQuery. You can use it to show a stream of tweets based on search queries, tweets from a specific user or a list. You can also filter the tweets by geographic location, language etc.
Sponsor Flip Wall With jQuery & CSS
Designing and coding a sponsors page is part of the developer’s life (at least the lucky developer’s life, if it is about a personal site of theirs). It, however, follows different rules than those for the other pages of the site. You have to find a way to fit a lot of information and organize it clearly, so that the emphasis is put on your sponsors, and not on other elements of your design.
출처 : Top design magazine
'WebPrograming > Jquery' 카테고리의 다른 글
| jQuery 플러그인 xml 을 json 객체로 변환 (0) | 2013.05.11 |
|---|---|
| Jquery, location.href, 페이지 이동 (1) | 2013.03.20 |
| [Java Script] Java Script 암호화(Packer) (0) | 2012.11.22 |
| jQuery Ajax - getJSON예제[실습] (0) | 2012.10.26 |
| [정보] jquery.validator 정리 (0) | 2012.09.24 |
response.setHeader("Cache-control","no-cache");
response.setHeader("Pragma","no-cache");
response.setDateHeader("Expires",0);
<META http-equiv="Cache-Control" content="no-cache"/>
<META http-equiv="Expires" content="0"/>
<META http-equiv="Pragma" content="no-cache"/>
'WebPrograming > JSP' 카테고리의 다른 글
| <jsp:include> 팁 (0) | 2013.01.18 |
|---|---|
| JSP 달력(CSS적용) (2) | 2012.03.29 |
http://pezium.godohosting.com/se
어제 하루동안 수정해 봤다. 인용구 버튼을 빼버리고 그 자리에 이미지 삽입 버튼을 넣었다. 쉽게 확장할 수 있게 되어 있어 별로 어렵지 않았다. 실제 활용을 위해서는 아직 좀 더 수정해야 할 것 같다.
파일 업로드를 jindo만 가지고 해보고 싶었는데 ajaxSubmit 기능이 없는 것 같아 그냥 jQuery로 했다. 다른 방안이 있겠지만 왠지 찾는게 귀찮다. 옛날에 회사다닐 때는 어떻게 그렇게 열심히 공부했는지.
전체 소스를 첨부한다.
SEFU.zip'WebPrograming' 카테고리의 다른 글
| QR code (0) | 2015.06.23 |
|---|
jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="java.util.*" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>jsp를 이용한 달력</title>
<script type="text/javascript">
function selectCheck(form){
form.submit();
}
function monthDown(form){
if(form.month.value>1){
form.month.value--;
}else {
form.month.value=12;
form.year.value--;
}
form.submit();
}
function monthUp(form){
if(form.month.value<12){
form.month.value++;
}else {
form.month.value=1;
form.year.value++;
}
form.submit();
}
</script>
</head>
<body>
<%
//현재 날짜 정보
Calendar cr = Calendar.getInstance();
int year = cr.get(Calendar.YEAR);
int month = cr.get(Calendar.MONTH);
int date = cr.get(Calendar.DATE);
//오늘 날짜
String today = year + ":" +(month+1)+ ":"+date;
//선택한 연도 / 월
String input_year = request.getParameter("year");
String input_month = request.getParameter("month");
if(input_month != null){
month = Integer.parseInt(input_month)-1;
}
if(input_year != null){
year = Integer.parseInt(input_year);
}
// 1일부터 시작하는 달력을 만들기 위해 오늘의 연도,월을 셋팅하고 일부분은 1을 셋팅한다.
cr.set(year, month, 1);
// 셋팅한 날짜로 부터 아래 내용을 구함
// 해당 월의 첫날를 구함
int startDate = cr.getMinimum(Calendar.DATE);
// 해당 월의 마지막 날을 구함
int endDate = cr.getActualMaximum(Calendar.DATE);
// 1일의 요일을 구함
int startDay = cr.get(Calendar.DAY_OF_WEEK);
int count = 0;
%>
<form method="post" action="calendar.jsp" name="change">
<table width="400" cellpadding="2" cellspacing="0" border="0" align="center">
<tr>
<td width="140" align="right"><input type="button" value="◁" onClick="monthDown(this.form)"></td>
<td width="120" align="center">
<select name="year" onchange="selectCheck(this.form)">
<%
for(int i=year-10;i<year+10;i++){
String selected = (i == year)?"selected":"";
String color = (i == year)?"#CCCCCC":"#FFFFFF";
out.print("<option value="+i+" "+selected+" style=background:"+color+">"+i+"</option>");
}
%>
</select>
<select name="month" onchange="selectCheck(this.form)">
<%
for(int i=1;i<=12;i++){
String selected = (i == month+1)?"selected":"";
String color = (i == month+1)?"#CCCCCC":"#FFFFFF";
out.print("<option value="+i+" "+selected+" style=background:"+color+">"+i+"</option>");
}
%>
</select></td>
<td width="140"><input type="button" value="▷" onClick="monthUp(this.form)"></td>
</tr>
<tr>
<td align="right" colspan="3"><a href="calendar.jsp"><font size="2">오늘 : <%=today %></font></a></td>
</tr>
</table>
</form>
<table width="400" cellpadding="2" cellspacing="0" border="1" align="center">
<tr height="30">
<td><font size="2">일</font></td>
<td><font size="2">월</font></td>
<td><font size="2">화</font></td>
<td><font size="2">수</font></td>
<td><font size="2">목</font></td>
<td><font size="2">금</font></td>
<td><font size="2">토</font></td>
</tr>
<tr height="30">
<%
for (int i=1;i<startDay;i++){
count++;
%>
<td> </td>
<%
}
for (int i=startDate;i<=endDate;i++){
String bgcolor = (today.equals(year+":"+(month+1)+":"+i))? "#CCCCCC" : "#FFFFFF";
String color = (count%7 == 0 || count%7 == 6)? "red" : "black";
count++;
%>
<td bgcolor="<%=bgcolor %>"><font size="2" color=<%=color %>><%=i %></font></td>
<%
if(count%7 == 0 && i < endDate){
%>
</tr>
<tr height="30">
<%
}
}
while(count%7 != 0){
%>
<td> </td>
<%
count++;
}
%>
</tr>
</table>
</body>
</html>
css
@charset "utf-8";
* {
margin: 0;
padding: 0;
line-height: 1.5;
font-family: gulim, sans-serif;
font-size:110%;
text-align:center;
}
.a2{
font-size:20px;
text-decoration: none;
color: #5c5c5c;
}
.list_over { background-color:#F3F7FD; }
.list_out { background-color:#FFFFFF; }
.list_over2 { background-color:#e5e5e5; }
a {
text-decoration: none;
color: #5c5c5c;
}
#today{
background-color:#CCCCCC;
color:#000000;
}
.base{
border:1px solid #8e8e8e;
}
.sun{
border:1px solid #8e8e8e;
color:#FF0000;
}
tr{
height:11%;
}
a:hover {
text-decoration: underline;
color: #5c5c5c;
}
.dot {style;
border-top-style: dashed;
border-right-style: dashed;
border-bottom-style: dashed;
border-left-style: dashed;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-color: rgb(71, 71, 71);
border-right-color: rgb(71, 71, 71);
border-bottom-color: rgb(71, 71, 71);
border-left-color: rgb(71, 71, 71);
background-color: rgb(232, 232, 232);
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 10px;
p style:margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
}
table {
border-collapse: collapse;
border-cellpadding: cellpadding;
height:100%;width:100%;
align:center;border:0;
}
주석안에 설명 다 있습니다.
CSS
마우스 온오버 효과 ,오늘날짜 표시,일요일 빨간색
'WebPrograming > JSP' 카테고리의 다른 글
| <jsp:include> 팁 (0) | 2013.01.18 |
|---|---|
| 뒤로가기 방지 (0) | 2012.06.11 |