Apprenez à utiliser rapidement Sublime Text3 pour écrire du HTML
藏色散人avant
2021-04-13 15:57:036749parcourir
La colonne tutorielle suivante de sublime vous présentera comment écrire du HTML en utilisant sublime Text 3. J'espère qu'elle sera utile aux amis dans le besoin !
1. Téléchargez et installez Sublime Text 3.
2. Ouvrez l'interface de Sublime Text 3.
Page d'accueil
3. Appuyez sur Ctrl+N pour créer une nouvelle page.
Nouvelle page
4. Appuyez sur Ctrl+S et enregistrez sous le nom de fichier que vous spécifiez, en utilisant le suffixe .html (le suffixe est important , Sublime Le type de langue sera déterminé en fonction du suffixe et la saisie semi-automatique correspondante sera activée pour vous). Par exemple, le nom du fichier est test.html
À l'heure actuelle, le nom de fichier de la page à onglet actuelle est devenu test.html
5. Entrez < h, comme le montre la figure, une fois que le répertoire des candidats à la complétion de code correspondant apparaît, vous pouvez voir que le HTML est localisé en premier, appuyez sur Entrée, et il sera automatiquement complété :
6. Comme le montre la figure , Sublime Text 3 génère automatiquement pour nous le framework de la page html, et nous n'avons plus à saisir laborieusement une grande quantité de contenu initial :
Remarque : est une nouvelle fonctionnalité dans HTML5
7. Entrez le nom de la page Web entre
le nom sur l'onglet du navigateur. Par exemple, saisissez index.</p>
<p><img alt="" class="has" style="max-width:90%" src="https://img.php.cn/upload/article/000/000/020/4d75661724eaae8e8b4a1899cd628f22-5.png" style="max-width:90%"></p>
<p>8. Saisissez <h2 entre <body> et </body> Ajoutez la complétion du code pour les titres secondaires. Par exemple, après avoir saisi un titre comme Chapitre 1, appuyez sur Ctrl+S pour enregistrer le fichier. </p>
<p><img alt="" class="has" style="max-width:90%" src="https://img.php.cn/upload/article/000/000/020/4d75661724eaae8e8b4a1899cd628f22-6.png" style="max-width:90%"></p>
<p>9. Il n'est pas nécessaire de fermer Sublime, utilisez simplement n'importe quel navigateur populaire pour ouvrir votre fichier test.html </p>
<p> <img alt="" class="has" style="max-width:90%" src="https://img.php.cn/upload/article/000/000/020/4d75661724eaae8e8b4a1899cd628f22-7.png" style="max-width:90%"></p> <p>Le nom de balise actuel du navigateur est le titre:index que vous avez entré, et le contenu de la barre d'adresse est le chemin local de votre fichier html. </p>
<p>Le chapitre 1 est le titre secondaire que vous venez de saisir. </p>
<p> 10. Ne fermez pas le navigateur, entrez <p dans Sublime et appuyez sur Entrée pour générer le code de fin de paragraphe entre <p> Ctrl+S pour enregistrer le fichier. </p>
<p><img alt="" class="has" style="max-width:90%" src="https://img.php.cn/upload/article/000/000/020/ace46a9fc85726b64bf045d2a130c455-8.png" style="max-width:90%"></p>
<p>11. Actualisez le navigateur et vous pouvez voir que le contenu de l'affichage HTML a changé : (L'opération d'actualisation dans le navigateur Chrome consiste à cliquer avec le bouton droit sur le menu pour recharger, ou appuyez sur Ctrl +R) </p>
<p><img alt="" class="has" style="max-width:90%" src="https://img.php.cn/upload/article/000/000/020/f7082c1550dc3fee7d8913fdfd23f69f-9.png" style="max-width:90%"></p>
<p> 12. À ce stade, la partie introductive de l'écriture HTML à l'aide de Sublime est terminée, et il est également possible d'utiliser le navigateur pour immédiatement et suivre manuellement les modifications des effets d’affichage lors de l’écriture du code. Nous pouvons également utiliser l'écran partagé dans Win10 pour juxtaposer Sublime au navigateur pour une observation plus facile. </p>
<p><img alt="" class="has" style="max-width:90%" src="https://img.php.cn/upload/article/000/000/020/f7082c1550dc3fee7d8913fdfd23f69f-10.png" style="max-width:90%"></p><p>Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!</p></div><div class="nphpQianMsg"><a href="javascript:void(0);">html5</a> <a href="javascript:void(0);">chrome</a> <a href="javascript:void(0);">html</a> <a href="javascript:void(0);">sublime text</a><div class="clear"></div></div><div class="nphpQianSheng"><span>Déclaration：</span><div>Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer</div></div></div><div class="nphpSytBox"><span>Article précédent：<a class="dBlack" title="Exécutez des programmes Java en utilisant Sublime Text3" href="http://m.php.cn/fr/faq/473409.html">Exécutez des programmes Java en utilisant Sublime Text3</a></span><span>Article suivant：<a class="dBlack" title="Exécutez des programmes Java en utilisant Sublime Text3" href="http://m.php.cn/fr/faq/474193.html">Exécutez des programmes Java en utilisant Sublime Text3</a></span></div><div class="nphpSytBox2"><div class="nphpZbktTitle"><h2>Articles Liés</h2><em><a href="http://m.php.cn/fr/article.html" class="bBlack"><i>Voir plus</i><b></b></a></em><div class="clear"></div></div><ins class="adsbygoogle"
style="display:block"
data-ad-format="fluid"
data-ad-layout-key="-6t+ed+2i-1n-4w"
data-ad-client="ca-pub-5902227090019525"
data-ad-slot="8966999616"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({});
</script><ul class="nphpXgwzList"><li><b></b><a href="http://m.php.cn/fr/faq/471374.html" title="Comment libérer de l'espace disque innocemment occupé dans Sublime" class="aBlack">Comment libérer de l'espace disque innocemment occupé dans Sublime</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/fr/faq/472703.html" title="Comment exécuter du code dans sublime" class="aBlack">Comment exécuter du code dans sublime</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/fr/faq/472957.html" title="Sublime Text3 construit un environnement de développement PHP [explication graphique détaillée]" class="aBlack">Sublime Text3 construit un environnement de développement PHP [explication graphique détaillée]</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/fr/faq/473245.html" title="Que dois-je faire si input() en python ne peut pas être exécuté dans sublime text3 ?" class="aBlack">Que dois-je faire si input() en python ne peut pas être exécuté dans sublime text3 ?</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/fr/faq/473409.html" title="Exécutez des programmes Java en utilisant Sublime Text3" class="aBlack">Exécutez des programmes Java en utilisant Sublime Text3</a><div class="clear"></div></li></ul></div></div><ins class="adsbygoogle"
style="display:block"
data-ad-format="autorelaxed"
data-ad-client="ca-pub-5902227090019525"
data-ad-slot="5027754603"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({});
</script><div class="nphpFoot"><div class="nphpFootBg"><ul class="nphpFootMenu"><li><a href="http://m.php.cn/fr/"><b class="icon1"></b><p>Maison</p></a></li><li><a href="http://m.php.cn/fr/course.html"><b class="icon2"></b><p>Cours</p></a></li><li><a href="http://m.php.cn/fr/wenda.html"><b class="icon4"></b><p>Questions et réponses</p></a></li><li><a href="http://m.php.cn/fr/login"><b class="icon5"></b><p>Mon</p></a></li><div class="clear"></div></ul></div></div><div class="nphpYouBox" style="display: none;"><div class="nphpYouBg"><div class="nphpYouTitle"><span onclick="$('.nphpYouBox').hide()"></span><a href="http://m.php.cn/fr/"></a><div class="clear"></div></div><ul class="nphpYouList"><li><a href="http://m.php.cn/fr/"><b class="icon1"></b><span>Maison</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/fr/course.html"><b class="icon2"></b><span>Cours</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/fr/article.html"><b class="icon3"></b><span>Article</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/fr/wenda.html"><b class="icon4"></b><span>Questions et réponses</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/fr/dic.html"><b class="icon6"></b><span>Dictionnaire</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/fr/course/type/99.html"><b class="icon7"></b><span>Manuel</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/fr/xiazai/"><b class="icon8"></b><span>Télécharger</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/fr/faq/zt" title="Sujet"><b class="icon12"></b><span>Sujet</span><div class="clear"></div></a></li><div class="clear"></div></ul></div></div><div class="nphpDing" style="display: none;"><div class="nphpDinglogo"><a href="http://m.php.cn/fr/"></a></div><div class="nphpNavIn1"><div class="swiper-container nphpNavSwiper1"><div class="swiper-wrapper"><div class="swiper-slide"><a href="http://m.php.cn/fr/" >Maison</a></div><div class="swiper-slide"><a href="http://m.php.cn/fr/article.html" class="hover">Article</a></div><div class="swiper-slide"><a href="http://m.php.cn/fr/wenda.html" >Questions et réponses</a></div><div class="swiper-slide"><a href="http://m.php.cn/fr/course.html" >Cours</a></div><div class="swiper-slide"><a href="http://m.php.cn/fr/faq/zt" >Sujet</a></div><div class="swiper-slide"><a href="http://m.php.cn/fr/xiazai" >Télécharger</a></div><div class="swiper-slide"><a href="http://m.php.cn/fr/game" >Jeu</a></div><div class="swiper-slide"><a href="http://m.php.cn/fr/dic.html" >Dictionnaire</a></div><div class="clear"></div></div></div><div class="langadivs" ><a href="javascript:;" class="bg4 bglanguage"></a><div class="langadiv" ><a onclick="javascript:setlang('zh-cn');" class="language course-right-orders chooselan " href="javascript:;"><span>简体中文</span><span>（ZH-CN）</span></a><a onclick="javascript:setlang('en');" class="language course-right-orders chooselan " href="javascript:;"><span>English</span><span>（EN）</span></a><a onclick="javascript:setlang('zh-tw');" class="language course-right-orders chooselan " href="javascript:;"><span>繁体中文</span><span>（ZH-TW）</span></a><a onclick="javascript:setlang('ja');" class="language course-right-orders chooselan " href="javascript:;"><span>日本語</span><span>（JA）</span></a><a onclick="javascript:setlang('ko');" class="language course-right-orders chooselan " href="javascript:;"><span>한국어</span><span>（KO）</span></a><a onclick="javascript:setlang('ms');" class="language course-right-orders chooselan " href="javascript:;"><span>Melayu</span><span>（MS）</span></a><a onclick="javascript:;" class="language course-right-orders chooselan chooselanguage" href="javascript:;"><span>Français</span><span>（FR）</span></a><a onclick="javascript:setlang('de');" class="language course-right-orders chooselan " href="javascript:;"><span>Deutsch</span><span>（DE）</span></a></div></div><script> var swiper = new Swiper('.nphpNavSwiper1', {
slidesPerView : 'auto',
observer: true,//修改swiper自己或子元素时，自动初始化swiper
observeParents: true,//修改swiper的父元素时，自动初始化swiper
});
</script></div></div><!--顶部导航 end--><script>isLogin = 0;</script><script type="text/javascript" src="/static/layui/layui.js"></script><script type="text/javascript" src="/static/js/global.js?4.9.47"></script></div><script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script><link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css' type='text/css' media='all'/><script type='text/javascript' src='/static/js/viewer.min.js?1'></script><script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script><script>jQuery.fn.wait = function (func, times, interval) {
var _times = times || -1, //100次
_interval = interval || 20, //20毫秒每次
_self = this,
_selector = this.selector, //选择器
_iIntervalID; //定时器id
if( this.length ){ //如果已经获取到了，就直接执行函数
func && func.call(this);
} else {
_iIntervalID = setInterval(function() {
if(!_times) { //是0就退出
clearInterval(_iIntervalID);
}
_times <= 0 || _times--; //如果是正数就 --
_self = $(_selector); //再次选择
if( _self.length ) { //判断是否取到
func && func.call(_self);
clearInterval(_iIntervalID);
}
}, _interval);
}
return this;
}
$("table.syntaxhighlighter").wait(function() {
$('table.syntaxhighlighter').append("<p class='cnblogs_code_footer'><span class='cnblogs_code_footer_icon'></span></p>");
});
$(document).on("click", ".cnblogs_code_footer",function(){
$(this).parents('table.syntaxhighlighter').css('display','inline-table');$(this).hide();
});
$('.nphpQianCont').viewer({navbar:true,title:false,toolbar:false,movable:false,viewed:function(){$('img').click(function(){$('.viewer-close').trigger('click');});}});
</script></body></html>
