>웹 프론트엔드 >CSS 튜토리얼 >CSS 편집 도구 Topstyle은 웹페이지 스타일_CSS/HTML을 쉽게 생성합니다.

CSS 편집 도구 Topstyle은 웹페이지 스타일_CSS/HTML을 쉽게 생성합니다.

WBOY
WBOY원래의
2016-05-16 12:10:491957검색
本文特意为你找来了一款CSS编辑利器——Topstyle,利用它你能轻松做出更有风格的网页来!

     精彩、漂亮是每一个设计者在制作网页时的不懈追求,而网页的精彩几乎都离不开CSS的强力“支撑”;CSS是一种为超文本标签语言提供增强补充服务的技 术,可对每一个html的标签做精雕细刻的修饰。活用CSS,将会使网页更加生动活泼。不过,普通的网页编辑工具在CSS方面,表现难能让人满意;为了充 分发挥CSS潜能,设计出更加美丽的网页.

  最新版本:3.11
  文件大小:3836KB
   软件性质:共享
   使用平台:Win9x/Me/NT/2000/XP

  软件功能

   该程序是一款功能强大的CSS编辑设计工具,功能相当多,不但你可以轻松创建各种样式的文件,而且方便对已有的样式进行编辑,其内置的CSS码检查功 能,可以让你减少写错的机会。特别是它的HELP文件中详细的各种CSS指令介绍,很适合用作参考文件和初次接触CSS的用户学习使用。

  下载安装

   Topstyle是一款专门用来让设计和编辑样式的工具,它的大小已经达到4M左右,可以说该软件是那种“强壮剽悍”型的,不过身材庞大也意味着该软件 实现的功能是比较新颖、实用和强大的。利用该软件,我们可以随心所欲地创建各种样式表文件,并且能为网页轻松设计出各种令你感到非常满意的视觉效果。从网 上下载下来的Topstyle是一个扩展名为exe的可执行文件,大家在进行安装之前,可以直接用鼠标双击它,这样系统就能自动打开一个标准的 windows程序安装界面,我们只要按照界面的提示,一路单击next按钮就能顺利完成安装了。该程序在没有注册的情况下,可以在同一台计算机中使用 20次;随Topstyle一起安装到系统中的还有一个名为Topstyle lite的程序,该程序在使用次数上没有什么限制,不过在功能方面肯定会有所限制,但对于普通个人用户来说,它提供的功能已经足够了!

CSS编辑利器——Topstyle
图1

   安装完成后,程序在默认状态下会自动在系统的开始菜单中添加一个Topstyle程序运行菜单项。此时,我们要是想运行Topstyle程序的话,可以 用鼠标依次单击“开始”/“程序”/“Topstyle 3”,屏幕上首先会出现一个样式定义向导窗口,在初次使用该程序时,可以先一路单击“next”按钮,这样就能打开一个如图1所示的程序主操作界面了。为 防止日后用户暂时不需要该软件时,该程序会占用的系统资源可能较多,我们可以在控制面板窗口中,利用添加删除程序来将Topstyle程序的所有组件彻底 从系统中清除,因此从这个意义上来说,该软件还可以称得上是一款绿色软件。一旦运行该程序后,该界面就是一种完全的XP风格,让人感到亲切、柔和!

  创建新的样式

   Topstyle程序为我们提供了几种创建新样式文件的方法,其中比较简单的一种就是使用向导功能来创建样式文件;在使用这种方法时,可以先用鼠标单击 主界面中的“file”菜单项,从打开的下拉菜单中执行“New style sheet wizard”命令,这样就能打开一个如图2所示的向导设置界面;用鼠标单击“next”按钮,在接下来出现的界面中,你就能对网页中的文字颜色以及背景 颜色进行合适的设置;设置完成后,继续单击“next”,接着为网页中文字选择一种合适的字体,需要哪种字体时,可以在对应字体前面的方框中打上勾号;完 成了这步设置后,下面你还可以设置网页中文字的大小,文字的加粗属性,网页中超级链接的正常显示颜色以及单击后的颜色变化,完成所有相关参数的设置后,向 导设置框还会打开一个如图3所示的预览界面;要是对设置的效果感到满意的话,可以继续用鼠标单击“next”来完成最后的样式创建任务。倘若对设置的效果 不满意的话,还能在这里单击“previous”按钮,来返回到前面的设置页面中,重新调整网页的样式属性,直到自己满意为止。最后,我们可以为上面创建 的样式文件起一个名称,同时选择好文件保存的位置,并单击向导界面中的“finish”按钮结束样式文件的创建工作。

CSS编辑利器——Topstyle
图2


CSS编辑利器——Topstyle
Figure 3

Modifier les styles existants

En plus de créer de nouveaux styles, nous pouvons également modifier et modifier les fichiers de style existants. Lors de l'édition et du réglage, vous pouvez exécuter les commandes "fichier"/"ouvrir" dans l'interface principale pour ouvrir les fichiers de style existants. Dans l'interface du programme Topstyle, utilisez divers boutons d'outils dans la barre d'outils pour modifier les fichiers de style. ; si vous connaissez très bien le code source de la page Web, vous pouvez choisir d'apporter des modifications dans la fenêtre du code source (comme le montre la figure 4). Si vous êtes "froid" sur le code source, nous pouvons également le modifier. dans le coin supérieur droit de l'interface du programme Topstyle. Modifiez-le dans la sous-fenêtre "Inspecteur de style", qui peut être plus directe, et ici nous pouvons également modifier presque tous les paramètres du style, tels que la taille, la police, la couleur de le texte de la page Web, la couleur d'arrière-plan de la page Web et la couleur du lien hypertexte, etc. De plus, exécutez la commande "fichier"/"ouvrir depuis le Web" dans la barre de menu et entrez directement l'URL d'un site Web dans la fenêtre ouverte ensuite, et nous pourrons accéder au site web Le style de la page web a été modifié et édité.

CSS编辑利器——TopstylePhoto 4

 

Vérifiez les erreurs de style
Pendant le processus d'édition et de modification du style, des erreurs d'une sorte ou d'une autre peuvent survenir en raison d'une opération imprudente. ne vous inquiétez pas, car Topstyle Le programme nous fournit la fonction de vérification des erreurs du code CSS, de sorte que les erreurs générées pendant le processus de modification ne soient pas ignorées par le programme Topstyle. Toute étape que nous effectuons pour modifier et créer le style est sous la « surveillance » du programme Topstyle. Une fois qu'une erreur de modification se produit, le programme affichera immédiatement une boîte de dialogue, comme le montre la figure 5, pour nous rappeler qu'une erreur s'est produite. s'est produit dans le style actuel ;En même temps, dans la sous-fenêtre d'édition du code source de l'interface principale, nous constaterons que les zones d'erreur du programme sont surlignées en rouge et dans la sous-fenêtre "Inspecteur de style" ; fenêtre, le programme mettra en surbrillance les zones d'erreur en bleu. Une fois l'erreur ajustée, la couleur de surbrillance à la position correspondante disparaîtra automatiquement.

CSS编辑利器——TopstylePhoto 5

 

Effet de style d'aperçu
Le programme Topstyle nous fournit également une fonction de prévisualisation instantanée. Grâce à cette fonction, l'effet de chaque étape de notre modification des paramètres de style peut être affiché instantanément. La sous-fenêtre « Sortie » de l'interface principale est utilisée pour prévisualiser instantanément l'effet de style. Dans cette sous-fenêtre, nous constatons qu'elle contient cinq pages à onglet. Cliquez sur l'onglet « aperçu » avec la souris pour voir le style spécifique. L'effet de prévisualisation est désormais disponible ; puisque le programme Topstyle prend en charge différentes versions des navigateurs IE, des navigateurs Netscape et des navigateurs Opera, nous pouvons prévisualiser différents styles tout en les modifiant, garantissant ainsi l'efficacité de l'édition de style. De plus, dans la page à onglet "Vérificateur de style", nous pouvons voir clairement quelles sont les erreurs grammaticales dans le fichier de style actuel. Après avoir cliqué sur un contenu d'erreur avec la souris, le programme Topstyle peut également afficher une invite d'information pour le savoir. comment nous pouvons corriger correctement les erreurs grammaticales. Dans d'autres pages à onglet, nous pouvons également apprendre des commentaires et des informations statistiques sur la feuille de style actuelle, telles que le nombre de lignes de contenu incluses dans le fichier de style.

 

Fonction d'apprentissage auxiliaire
Le programme Topstyle fournit des fonctions d'aide détaillées notamment pour les utilisateurs novices qui viennent d'entrer en contact avec CSS. Grâce à cette fonction, les utilisateurs peuvent interroger l'introduction détaillée de l'utilisation de diverses instructions liées au CSS à partir du fichier d'aide intégré du programme, ainsi que quelques conseils pour écrire du code CSS original. Les débutants peuvent l'utiliser comme une bonne information CSS pour apprendre. comment utiliser.

De plus, la version Topstyle Lite installée avec le programme Topstyle a des fonctions relativement plus simples et plus claires. Nous pouvons exécuter cette version simplifiée du programme dans le répertoire d'installation du programme Topstyle ; simple Il a les fonctions d'édition, de création et de prévisualisation des fichiers de style, mais il n'y a pas de fonction de création d'assistant, de fonction de vérification des erreurs de code CSS, etc. Cependant, ces fonctions sont plus que suffisantes pour les utilisateurs novices !

Bref, les performances globales du programme Topstyle sont très bonnes, et c'est un outil d'édition de feuilles de style rare et indispensable. Avec l'aide du programme Topstyle, je pense que vous deviendrez un excellent expert en édition et en conception CSS.

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