목차
博客侧边栏公告:
 页脚Html代码:
  页面定制CSS代码
 定制JS
웹 프론트엔드 HTML 튜토리얼 自定义自己的博客首页_html/css_WEB-ITnose

自定义自己的博客首页_html/css_WEB-ITnose

Jun 24, 2016 am 11:53 AM

直接上代码

博客侧边栏公告:

联系我是通过腾讯QQ的方式联系我,会根据QQ的在线状态显示不同颜色的图标。


自定义自己的博客首页_html/css_WEB-ITnose

企鹅:
自定义自己的博客首页_html/css_WEB-ITnose alt="Candyメ奶糖" title="Candyメ奶糖">

 

 页脚Html代码:

请关注我的微博:
    Candy奶糖
    想哥




在博客右侧,浮出一个微博浮动框

  页面定制CSS代码

/*---------------------------------共通 Start---------------------------------*/body {	margin: 0;	padding: 0;	font-family: 'Microsoft YaHei', 'Segoe UI', Tahoma, Arial, Helvetica,		sans-serif;	font-size: 14px;	vertical-align: top;	color: #000;}#main {	margin: 0 auto;	padding: 20px 0;	width: 1024px;}#mainContent {	float: right;	width: 790px;}a,a:hover,a:active,a:visited {	text-decoration: none;	color: #267CB2;}a:hover {	text-decoration: none;	color: #F60;}ul,li {	list-style: none;}ul {	margin: 0;	padding: 0;}/* 返回顶部 */#toTop {	width: 28px;	height: 65px;	position: fixed;	right: 20px;	bottom: 65px;	background:		url(http://images.cnblogs.com/cnblogs_com/Candies/632934/o_backtop.png)		no-repeat 0px 0px;	opacity: 0.6;}#toTop:hover {	opacity: 1;	filter: alpha(opacity = 100);	background:		url(http://images.cnblogs.com/cnblogs_com/Candies/632934/o_backtop.png)		no-repeat -28px 0px;}/* 页脚微博 */#share {	width: 35px;	position: fixed;	right: 20px;	bottom: 150px;}#share a {	color: #333;}#share a#sina {	line-height: 3;	background: transparent		url(http://images.cnblogs.com/cnblogs_com/Candies/632934/o_WB_logo.png)		no-repeat 0px 0px;}#share a#tent {	line-height: 3;	background: transparent		url(http://images.cnblogs.com/cnblogs_com/Candies/632934/o_tx_wb_logo.png)		no-repeat 0px 0px;}/*#share {	position:fixed;	bottom: 0px;	right: 0px;	width: 450px;	margin: 0 auto;	border: 1px solid #CC0;	background: #F4FAED;	padding: 5px 10px 3px}#share a {	background: transparent		url(http://image.dili360.com/www/img/sharelogo.png) no-repeat scroll 0		0;	line-height: 1.8;	color: #333;	margin: 0 0 0 10px;	padding: 3px 0 3px 18px;}#share a#sina {	background-position: 0 -79px}#share a#tent {	background-position: 0 -129px}*//* 隐藏页脚 */#footer {	background-color: #F1F4F4;	padding-top: 25px;	color: #333;	text-align: center;}#cnzz_stat_icon_1253650355 {	width: 100%;	display: inline-block;	background-color: #F1F4F4;	padding-bootom: 25px;	text-align: center;}/*---------------------------------共通 End---------------------------------*//*---------------------------------导航栏 Start---------------------------------*/#navList {	background:		url(http://images.cnblogs.com/cnblogs_com/libaoheng/435190/o_bg-tabs.png)		no-repeat center bottom;	border: none !important;	height: 52px;	text-align: center;	margin: 0 0 12px;	padding: 15px 0 1px;	font-size: 16px;}#navList li {	margin: 0;	display: inline-block;	vertical-align: bottom;}#navList a {	font-family: 'Microsoft YaHei';	color: #333;	text-decoration: none;	background: #D8E1EC		url(http://i1.asp.net/images/ui/sprite-ui.png?cdn_id=t32) repeat-x 0		-363px;	border: 1px solid #D8E1EC;	border-bottom: 0;	display: block;	padding: 16px 36px 0;	margin: 0;	position: relative;	top: 0;	text-align: center;	-moz-border-radius: 3px 3px 0 0;	-webkit-border-radius: 3px 3px 0 0;	border-radius: 3px 3px 0 0;	min-height: 36px;}#navList a:hover,#MyLinks1_MyHomeLink {	background: white !important;	color: #000 !important;	border: 1px solid #CFD0D3 !important;	border-bottom: 0 !important;	-moz-box-shadow: 0 6px 0 #fff, 0 0 4px #bbb !important;	-webkit-box-shadow: 0 6px 0 white, 0 0 4px #BBB !important;	box-shadow: 0 6px 0 white, 0 0 4px #BBB !important;}/*---------------------------------导航栏 End---------------------------------*//*---------------------------------标题 Start---------------------------------*//* 博客标题 */#blogTitle {	margin: 0 auto;	padding-left: 100px;	background-color: #D2D8DE;	height: 106px;}#blogTitle .title {	width: 1024px;	margin: 0 auto;	padding: 26px 0 0;}#blogTitle h2 {	font-size: 14px;	font-weight: normal;}/* 标题 */h1 {	margin: 0;	padding: 0;}h1.postTitle {	padding: 0;	background: #fff;	font-size: 24px;}h1.postTitle a {	color: #000;	text-decoration: none !important;}h3 {	margin: 10px 0;	padding: 0;	font-size: 14px;}h3.catListTitle {	color: #fff;}/*---------------------------------标题 End---------------------------------*//*---------------------------------侧边栏 Start---------------------------------*/#sideBar {	min-height: 200px;	padding: 0px 0 0px 5px;	float: left;	-o-text-overflow: ellipsis;	text-overflow: ellipsis;	overflow: hidden;	word-break: break-all;}/* 不显示公告 */.newsItem .catListTitle {	display: none;}/* 时钟 */.divBlock,#honehoneclock {	display: block;}.blog-news {	margin-top: 5px;	line-height: 1.5;	text-align: left;}.catList,.catListTag,.mySearch,.catListLink,.catListPostCategory,.catListPostArchive,.catListBlogRank	{	border-radius: 7px;	border-bottom: 1px dotted #ccc;}.catListTitle {	background-color: #267CB2;	font-size: 16px;	border-bottom: 1px solid #006600;	border-top-left-radius: 7px;	border-top-right-radius: 7px;	font-size: 1.2em;	height: 1.8em;	line-height: 1.8em;	padding: 5px;	text-indent: 0.5em;	text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3);}/* 加大随笔档案、随笔分类等列表间距 */.catList ul li,.catListTag ul li,.catListLink ul li,.catListPostArchive ul li,.catListPostCategory ul li,.catListBlogRank ul li	{	padding: 5px 0px 5px 10px}/*---------------------------------侧边栏 End---------------------------------*//*---------------------------------博文列表 Start---------------------------------*//* 日期块、从随笔分类和随笔档案点开的一览页面 */.day,.entrylistItem {	min-height: 10px;	_height: 10px;	background: #fff;	border-radius: 7px;	box-shadow: 1px 1px 2px #aaa;	margin: 0 5px 20px 0;	padding: 5px 20px 5px 20px;}/* 日期标题 */.dayTitle {	color: #666;	line-height: 2.2em;	font-size: 22px;	clear: both;	border-bottom: 1px solid #ccc;	text-align: center;}/* 博文标题 */.postTitle,.entrylistPosttitle {	font-size: 16px;	font-weight: bold;	padding: 3px 0 4px 24px;	border-bottom: 1px dashed #ccc;	line-height: 2.5em;	clear: both;	background:		url(http://images.cnblogs.com/cnblogs_com/Candies/632934/o_titile-icons.png)		no-repeat 0px 50%;}.postTitle a:link,.postTitle a:visited,.postTitle a:active,.entrylistPosttitle a:link,.entrylistPosttitle a:visited,.entrylistPosttitle a:active	{	transition: all 0.4s linear 0s;}/* 博文标题 */.postTitle a:hover,.entrylistPosttitle a:hover {	color: #F60;	text-decoration: none;	margin-left: 10px;}/* 博文内容 */.postCon,.entrylistPostSummary {	margin: 10px 0px;}.postDesc a {	display: none;}/* 博文post脚 */.postDesc,.entrylistItemPostDesc {	text-align: right;	color: #999;}/* 不显示随笔档案-XX、随笔分类-XX和描述 */.entrylistTitle,.entrylistDescription {	display: none;}/*---------------------------------博文列表 End---------------------------------*//*---------------------------------博文内容页面 Start---------------------------------*//* 博客签名 */#MySignature {	/*background:url("http://images.cnblogs.com/cnblogs_com/Candies/632934/o_o_light2.png") no-repeat 10px 50%;*/	background:		url("http://images.cnblogs.com/cnblogs_com/Candies/632934/o_may.png")		no-repeat 20px 40%;	margin-top: 20px;	padding: 10px 10px 10px 120px;	box-shadow: 0px 0px 15px #aaa;	border-radius: 25px;	border: 1px dotted #FFD596;}#MySignature a {	color: #FB9400;}/* 屏蔽广告 */#site_nav_under,#ad_under_post_holder,#google_ad_c2 {	display: none;}/*博客目录*/#sideBarView {	font-size: 12px;	font-family: Arial, Helvetica, sans-serif;	text-align: left;	position: fixed;	/*将div的位置固定到距离top:50px,right:0px的位置,这样div就会处在最右边的位置,距离顶部50px*/	top: 299px;	right: 30px;	width: auto;	height: auto;}#sideBarTab {	float: left;	width: 30px;	border: 1px solid #e5e5e5;	border-right: none;	text-align: center;	background: #ffffff;	background-color: #F1F4F4;	border-radius: 5px;}#sideBarContents { /*float:left;    overflow:auto;     overflow-x:hidden;!important;*/	width: 200px;	min-height: 108px;	max-height: 460px;	border: 1px solid #e5e5e5;	background: #ffffff;	border-radius: 5px;}#sideBarContents dl {	margin-top: 15px;	margin-bottom: 15px;	padding: 0;}#sideBarContents dt {	margin-top: 15px;	margin-left: 5px;}#sideBarContents dd,dt {	cursor: pointer;}#sideBarContents dd:hover,dt:hover {	color: #A7995A;}/*---------------------------------博文内容页面 End---------------------------------*//*---------------------------------评论 Start---------------------------------*//*评论*/#tbCommentBody {	width: 500px;}#btn_comment_submit {	width: 80px;	height: 28px;}.feedbackListSubtitle div {	margin: 5px 10px 5px 10px;}.blog_comment_body fieldset.comment_quote {	border-color: #1a8bc8;}/*美化一下评论,增加气泡效果*/.feedbackListSubtitle {	border: 0px none;	border-bottom-style: none;}.list {	width: 90%;}.list .out,.list .inc {	margin: 6px 0;	width: 90%;}.list .out .icon,.list .inc .icon {	width: 48px;	height: 48px;}.list .icontd {	width: 48px;}.list .out .icontd {	display: none;}.list .out .topleft,.list .out .topright,.list .out .bottomleft,.list .out .bottomright,.list .inc .topleft,.list .inc .topright,.list .inc .bottomleft,.list .inc .bottomright	{	background:		url(http://images.cnblogs.com/cnblogs_com/Candies/632934/o_t_o_bubbles.png)		no-repeat;}.list .out .top,.list .out .bottom,.list .inc .top,.list .inc .bottom {	background: transparent		url(http://images.cnblogs.com/cnblogs_com/Candies/632934/o_t_o_horizontal.png)		repeat-x;}.list .out .left,.list .out .right,.list .inc .left,.list .inc .right {	background: transparent		url(http://images.cnblogs.com/cnblogs_com/Candies/632934/o_t_o_vertical.png)		repeat-y;}.list .out .topleft {	background-position: left top;	height: 9px;	width: 18px;}.list .out .topright {	background-position: -18px top;	height: 9px;	width: 11px;}.list .out .bottomleft {	background-position: left -9px;	width: 18px;	height: 12px;}.list .out .bottomright {	background-position: right -9px;	width: 11px;	height: 12px;}.list .out .top {	background-position: top;	font-size: 1px;	height: 9px;}.list .out .bottom {	background-position: 0 -9px;	height: 12px;}.list .out .left {	background-position: left;	width: 18px;}.list .out .right {	background-position: -18px 0;	width: 11px;}.list .inc .topleft {	background-position: 0 -21px;	height: 9px;	width: 18px;}.list .inc .topright {	background-position: -18px -21px;	height: 9px;	width: 11px;}.list .inc .bottomleft {	background-position: 0 bottom;	width: 18px;	height: 12px;}.list .inc .bottomright {	background-position: right bottom;	width: 11px;	height: 12px;}.list .inc .top {	background-position: 0 -21px;	font-size: 1px;	height: 9px;}.list .inc .bottom {	background-position: bottom;	height: 12px;}.list .inc .left {	background-position: -29px 0;	width: 18px;}.list .inc .right {	background-position: right;	width: 11px;}.list .inc .conmts {	font-size: 12px;	color: #000;}.list .out .conmts {	background: #dcdcdc; /*text-shadow:0 1px 0 #eee;*/}.list .inc .conmts {	background: #c0e668; /*text-shadow:0 1px 0 #dfa;*/}/*.blog_comment_body {	border-radius: 15px;	box-shadow: 0px 0px 15px #aaa;	border: 2px solid #FFD596;	display: inline-block;	margin: 10px 0px;	padding: 15px;	position: relative;}.blog_comment_body_em {	display: block;	border-width: 15px;	position: absolute;	top: -32px;	left: 20px;	border-style: dashed dashed solid;	border-color: transparent transparent #FFD596;	font-size: 0;	line-height: 0;}.blog_comment_body_tag {	display: block;	border-width: 15px;	position: absolute;	top: -28px;	left: 20px;	border-style: dashed dashed solid;	border-color: transparent transparent #FFF;	font-size: 0;	line-height: 0;}*//*---------------------------------评论End---------------------------------*/
로그인 후 복사

定制JS

    var BlogCommentBody = {        createBlogCommentStyle : function(id) {            //获取博文正文div容器            var elem = document.getElementById(id);            if (!elem)                return false;            //获取div中所有元素结点            var nodes = elem.getElementsByTagName("*");            //遍历所有元素结点            for ( var i = 0; i < nodes.length; i++) {                if (nodes[i].getAttribute("class") == "blog_comment_body") {                    var blog_comment_body_em = document.createElement('EM');                    blog_comment_body_em.setAttribute('class',                            'blog_comment_body_em');                    var blog_comment_body_tag = document.createElement('SPAN');                    blog_comment_body_tag.setAttribute('class',                            'blog_comment_body_tag');                    nodes[i].appendChild(blog_comment_body_em);                    nodes[i].appendChild(blog_comment_body_tag);                }            }        }    }    var BlogDirectory = {        /*            获取元素位置,距浏览器左边界的距离(left)和距浏览器上边界的距离(top)        */        getElementPosition:function (ele) {                    var topPosition = 0;            var leftPosition = 0;            while (ele){                              topPosition += ele.offsetTop;                leftPosition += ele.offsetLeft;                        ele = ele.offsetParent;                 }              return {top:topPosition, left:leftPosition};         },        /*        获取滚动条当前位置        */        getScrollBarPosition:function () {            var scrollBarPosition = document.body.scrollTop || document.documentElement.scrollTop;            return  scrollBarPosition;        },                /*        移动滚动条,finalPos 为目的位置,internal 为移动速度        */        moveScrollBar:function(finalpos, interval) {            //若不支持此方法,则退出            if(!window.scrollTo) {                return false;            }            //窗体滚动时,禁用鼠标滚轮            window.onmousewheel = function(){                return false;            };                          //清除计时            if (document.body.movement) {                 clearTimeout(document.body.movement);             }             var currentpos =BlogDirectory.getScrollBarPosition();//获取滚动条当前位置            var dist = 0;             if (currentpos == finalpos) {//到达预定位置,则解禁鼠标滚轮,并退出                window.onmousewheel = function(){                    return true;                }                return true;             }             if (currentpos < finalpos) {//未到达,则计算下一步所要移动的距离                dist = Math.ceil((finalpos - currentpos)/10);                 currentpos += dist;             }             if (currentpos > finalpos) {                 dist = Math.ceil((currentpos - finalpos)/10);                 currentpos -= dist;             }                        var scrTop = BlogDirectory.getScrollBarPosition();//获取滚动条当前位置            window.scrollTo(0, currentpos);//移动窗口            if(BlogDirectory.getScrollBarPosition() == scrTop)//若已到底部,则解禁鼠标滚轮,并退出            {                window.onmousewheel = function(){                    return true;                }                return true;            }                        //进行下一步移动            var repeat = "BlogDirectory.moveScrollBar(" + finalpos + "," + interval + ")";             document.body.movement = setTimeout(repeat, interval);         },                htmlDecode:function (text){            var temp = document.createElement("div");            temp.innerHTML = text;            var output = temp.innerText || temp.textContent;            temp = null;            return output;        },        /*        创建博客目录,        id表示包含博文正文的 div 容器的 id,        mt 和 st 分别表示主标题和次级标题的标签名称(如 H2、H3,大写或小写都可以!),        interval 表示移动的速度        */        createBlogDirectory:function (id, mt, st, interval){             //获取博文正文div容器            var elem = document.getElementById(id);            if(!elem) return false;            //获取div中所有元素结点            var nodes = elem.getElementsByTagName("*");            //创建博客目录的div容器            var divSideBar = document.createElement('DIV');            divSideBar.className = 'sideBarView';            divSideBar.setAttribute('id', 'sideBarView');            var divSideBarTab = document.createElement('DIV');            divSideBarTab.setAttribute('id', 'sideBarTab');            divSideBar.appendChild(divSideBarTab);            var h2 = document.createElement('H2');            divSideBarTab.appendChild(h2);            var txt = document.createTextNode('目录导航');            h2.appendChild(txt);            var divSideBarContents = document.createElement('DIV');            divSideBarContents.style.display = 'none';            divSideBarContents.setAttribute('id', 'sideBarContents');            divSideBar.appendChild(divSideBarContents);            //创建自定义列表            var dlist = document.createElement("dl");            divSideBarContents.appendChild(dlist);            var num = 0;//统计找到的mt和st            mt = mt.toUpperCase();//转化成大写            st = st.toUpperCase();//转化成大写            //遍历所有元素结点            for(var i=0; i<nodes.length; i++)            {                if(nodes[i].nodeName == mt|| nodes[i].nodeName == st)                    {                    //获取标题文本                    var nodetext = nodes[i].innerHTML.replace(/<\/?[^>]+>/g,"");//innerHTML里面的内容可能有HTML标签,所以用正则表达式去除HTML的标签                    nodetext = nodetext.replace(/ /ig, "");//替换掉所有的                     nodetext = BlogDirectory.htmlDecode(nodetext);                    //插入锚                            nodes[i].setAttribute("id", "blogTitle" + num);                    var item;                    switch(nodes[i].nodeName)                    {                        case mt:    //若为主标题                             item = document.createElement("dt");                            break;                        case st:    //若为子标题                            item = document.createElement("dd");                            break;                    }                                        //创建锚链接                    var itemtext = document.createTextNode(nodetext);                    item.appendChild(itemtext);                    item.setAttribute("name", num);                    item.onclick = function(){        //添加鼠标点击触发函数                        var pos = BlogDirectory.getElementPosition(document.getElementById("blogTitle" + this.getAttribute("name")));                        if(!BlogDirectory.moveScrollBar(pos.top, interval)) return false;                    };                                                    //将自定义表项加入自定义列表中                    dlist.appendChild(item);                    num++;                }            }                        if(num == 0) return false;             /*鼠标进入时的事件处理*/            divSideBarTab.onmouseenter = function(){                divSideBarContents.style.display = 'block';            }            /*鼠标离开时的事件处理*/            divSideBar.onmouseleave = function() {                divSideBarContents.style.display = 'none';            }            document.body.appendChild(divSideBar);        }            };    function CommentBubble()    {        var w1 = '<div class="list">' +                '<table class="out" border="0" cellspacing="0" cellpadding="0"> ' +                    '<tr>' +                        '<td class="icontd" align="right" valign="bottom">' +                            '<img  src="/static/imghw/default1.png"  data-src="http://pic.cnitblog.com/face/516492/20140827145520.png"  class="lazy"    style="max-width:90%" height="57px"/ alt="自定义自己的博客首页_html/css_WEB-ITnose" >' +                        '</td>' +                        '<td align="left" valign="bottom" class="q">' +                            '<table border="0" cellpadding="0" cellspacing="0" > ' +                                '<tr><td class="topleft"></td><td class="top"></td><td class="topright"></td></tr> ' +                                '<tr><td class="left"></td> <td align="left" class="conmts"><p>';                                  var w2 = '</p> </td> <td class="right"></td></tr> ' +                                '<tr><td class="bottomleft"></td><td class="bottom"></td><td class="bottomright"></td></tr> ' +                            '</table>' +                        '</td> ' +                    '</tr> ' +                '</table> ' +            '</div>';         $.each($(".blog_comment_body"), function(i, t) {            $(t).html(w1 + $(t).html() + w2);        });                $(".louzhu").closest(".feedbackItem").find(".out").removeClass("out").addClass("inc");                /*.find(".q").attr("align","right");*/    }        $(document).ready(function() {        var commentTime = setInterval(function(){if($("#comments_pager_bottom").length>0){CommentBubble();clearTimeout(commentTime);}},50);        /*页面加载完成之后生成博客目录*/        BlogDirectory.createBlogDirectory("cnblogs_post_body","h2","h3",20);        //BlogCommentBody.createBlogCommentStyle("blog-comments-placeholder");    });
로그인 후 복사

 

본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

AI Hentai Generator

AI Hentai Generator

AI Hentai를 무료로 생성하십시오.

뜨거운 도구

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

공식 계정 웹 페이지의 캐싱 업데이트에 어려움 : 버전 업데이트 후 사용자 경험에 영향을 미치는 이전 캐시를 피하는 방법은 무엇입니까? 공식 계정 웹 페이지의 캐싱 업데이트에 어려움 : 버전 업데이트 후 사용자 경험에 영향을 미치는 이전 캐시를 피하는 방법은 무엇입니까? Mar 04, 2025 pm 12:32 PM

공식 계정 웹 페이지 업데이트 캐시, 이것은 간단하고 간단하며 냄비를 마시기에 충분히 복잡합니다. 공식 계정 기사를 업데이트하기 위해 열심히 노력했지만 사용자는 여전히 기존 버전을 열었습니까? 이 기사에서는이 뒤에있는 비틀기와 회전을 살펴 보고이 문제를 우아하게 해결하는 방법을 살펴 보겠습니다. 읽은 후에는 다양한 캐싱 문제를 쉽게 처리 할 수있어 사용자가 항상 가장 신선한 콘텐츠를 경험할 수 있습니다. 기본 사항에 대해 먼저 이야기 해 봅시다. 액세스 속도를 향상시키기 위해 브라우저 또는 서버는 일부 정적 리소스 (예 : 그림, CSS, JS) 또는 페이지 컨텐츠를 저장합니다. 다음에 액세스 할 때 다시 다운로드하지 않고도 캐시에서 직접 검색 할 수 있으며 자연스럽게 빠릅니다. 그러나 이것은 또한 양날의 검입니다. 새 버전은 온라인입니다.

HTML5 양식 유효성 검사 속성을 사용하여 사용자 입력을 유효성있게하려면 어떻게합니까? HTML5 양식 유효성 검사 속성을 사용하여 사용자 입력을 유효성있게하려면 어떻게합니까? Mar 17, 2025 pm 12:27 PM

이 기사에서는 브라우저에서 직접 사용자 입력을 검증하기 위해 필요한, Pattern, Min, Max 및 Length 한계와 같은 HTML5 양식 검증 속성을 사용하는 것에 대해 설명합니다.

HTML5의 크로스 브라우저 호환성에 대한 모범 사례는 무엇입니까? HTML5의 크로스 브라우저 호환성에 대한 모범 사례는 무엇입니까? Mar 17, 2025 pm 12:20 PM

기사는 HTML5 크로스 브라우저 호환성을 보장하기위한 모범 사례에 대해 논의하고 기능 감지, 점진적 향상 및 테스트 방법에 중점을 둡니다.

웹 페이지의 PNG 이미지에 뇌졸중 효과를 효율적으로 추가하는 방법은 무엇입니까? 웹 페이지의 PNG 이미지에 뇌졸중 효과를 효율적으로 추가하는 방법은 무엇입니까? Mar 04, 2025 pm 02:39 PM

이 기사는 CSS를 사용한 웹 페이지에 효율적인 PNG 테두리 추가를 보여줍니다. CSS는 JavaScript 또는 라이브러리에 비해 우수한 성능을 제공하며, 미묘하거나 눈에 띄는 효과를 위해 테두리 너비, 스타일 및 색상 조정 방법을 자세히 설명합니다.

& lt; datalist & gt의 목적은 무엇입니까? 요소? & lt; datalist & gt의 목적은 무엇입니까? 요소? Mar 21, 2025 pm 12:33 PM

이 기사는 HTML & LT; Datalist & GT에 대해 논의합니다. 자동 완성 제안을 제공하고, 사용자 경험을 향상시키고, 오류를 줄임으로써 양식을 향상시키는 요소. 문자 수 : 159

& lt; Progress & Gt의 목적은 무엇입니까? 요소? & lt; Progress & Gt의 목적은 무엇입니까? 요소? Mar 21, 2025 pm 12:34 PM

이 기사는 HTML & lt; Progress & Gt에 대해 설명합니다. 요소, 그 목적, 스타일 및 & lt; meter & gt의 차이; 요소. 주요 초점은 & lt; progress & gt; 작업 완료 및 & lt; meter & gt; Stati의 경우

html5 & lt; time & gt; 의미 적으로 날짜와 시간을 나타내는 요소? html5 & lt; time & gt; 의미 적으로 날짜와 시간을 나타내는 요소? Mar 12, 2025 pm 04:05 PM

이 기사는 html5 & lt; time & gt; 시맨틱 날짜/시간 표현 요소. 인간이 읽을 수있는 텍스트와 함께 기계 가독성 (ISO 8601 형식)에 대한 DateTime 속성의 중요성을 강조하여 Accessibilit를 향상시킵니다.

& lt; meter & gt의 목적은 무엇입니까? 요소? & lt; meter & gt의 목적은 무엇입니까? 요소? Mar 21, 2025 pm 12:35 PM

이 기사는 HTML & lt; meter & gt에 대해 설명합니다. 범위 내에 스칼라 또는 분수 값을 표시하는 데 사용되는 요소 및 웹 개발의 일반적인 응용 프로그램. & lt; meter & gt; & lt; Progress & Gt; 그리고 Ex

See all articles