Wie kann ich die Border eines Tabpanes ansprechen?

Guten Tag,

ich wollte fragen wie ich die Border eines Tabpanes ansprechen kann. Um genauer zu sein möchte ich fragen, ob man die Brightness der Border des Tabpanes ansprechen kann.

1 Antwort

Vom Fragesteller als hilfreich ausgezeichnet

regex9

Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer

programmieren, CSS, JavaFX

06.05.2021, 02:07

JavaFX setzt den Rahmen öfter durch die einfache Schachtelung zweier Layer mit unterschiedlichen Hintergründen um.

Du kannst es einmal mit diesem Style probieren:

.my-custom-tabpane-style {
  -fx-background-color: rgba(255, 255, 0, 150);
  -fx-control-inner-background: rgba(255, 255, 0, 255);
}

Die Hintergrundfarbe wird hier demonstrativ mit rot besetzt.

Zuordnung im Code:

yourTabPane.getStyleClass().add("my-custom-tabpane-style");

Für eine Einbindung in FXML lies hier.

Ansonsten findest du die Standardstyles (so auch für tab-pane) der Skins Modena und Caspian in den CSS-Dateien dieser Ordner:

Daran kannst du dich bezüglich des Aufbaus des Elements orientieren.

Bekanntlich kann man ja fast allen Elementen einen border-radius verpassen, jedoch möchte ich dies auf das Fenster selbst - die Scene - setzen. Ist das denn möglich?

Gescheiterte Versuche:

Style im SceneBuilder auf -fx-border-radius: 20 setzen
In der .css-Datei -fx-border-radius: 20 auf die fx:id AnchorPane_Background setzen

Oder funktioniert das nur auf Elementen im Fenster selbst?

...zur Frage

Wie kann ich den Inhalt einer Border färben HTML&CSS?

Wie kann ich den Inhalt einer Border in eine bestimmte Farbe ändern (in CSS oder HTML)?

...zur Frage

CSS Lichterkette als Border?

Hallo, für ein Schulprojekt muss ich eine Adventkalenderwebsite programmieren und designen. Jedenfalls habe ich ein kleines Fenster (Div), dass ich gerne mit einer Lichterkette umranden würde (gerne animiert). Ich habe bereits mit border-image herumprobiert, jedoch hat es nicht wirklich gut geklappt. Habt ihr eine Lösung?

...zur Frage

Auswendig lernen beim Programmieren lernen oder wie vorgehen (Frage unten genauer erläutert)?

Hey,

ich möchte HTML, CSS und JavaScript lernen, da dies ja im Bereich Web Development sehr gefragt ist und ich habe mich allgemein gefragt, wie ich vorgehen soll bei lernen und ob ich Sachen auswendig lernen muss (wenn ja, was denn?)

Wäre cool, wenn ihr mich erleuchtet :D

...zur Frage

Grid Layout funktioniert nicht?

<div id="story">
		<p id="grid1">1</p>
		<p id="grid2">2</p>
		<p id="grid3">3</p>
		<p id="grid4">4</p>
		<p id="grid5">5</p>
		<p id="grid6">6</p>
	</div>

#grid1{
	grid-area: "eins";
	border: 1px solid black;
}
#grid2{
	grid-area: "zwei";
	border: 1px solid black;
}
#grid3{
	grid-area: "drei";
	border: 1px solid black;
}
#grid4{
	grid-area: "vier";
	border: 1px solid black;
}
#grid5{
	grid-area: "fünf";
	border: 1px solid black;
}
#grid6{
	grid-area: "sechs";
	border: 1px solid black;
}


#story{
	padding: 15px;
	color:  white;
	background-color: rgb(0, 0, 255);
	display: grid;
	grid-template-columns: 200px 200px 200px;
	grid-template-rows: 200px 200px 200px;
	gap: 16px;
	grid-template-areas:
	"eins" "eins" "zwei"
	"drei" "vier" "zwei"
	"fünf" "vier" "sechs";
}

Es wird bei mir Quasi nur 1 2 3 nächste Zeile 4 5 6 angezeigt. Bild in der Ergänzung meiner letzten Frage. Ich will aber dass es so aussieht wie in grid template areas nur halt dass nicht zum Beispiel 1 1 dasteht sondern nur ein großes Feld mit der Zahl 1 drinnen.

...zur Frage

HTML/CSS-Button(Bild ändern)?

Hallo, ich arbeite gerade an einen Button. Aber wie kann ich dieses Herz durch ein Bild ersetzten?

.icon{

background-color: white;

color: #00472d;

border: none;

font-size: 2rem;

padding: 0.5em;

line-height: 1;

width: 2em;

transition: border-radius 2s ease;

}

.icon:hover{

background-color:#00472d;

color: white;

border-radius: 50%;

...zur Frage

Wie in Visual Studio einen Kommentar/Vermerk hinzufügen, den nur ich sehen kann und nicht ausgegeben wird?

Hallo zusammen, wenn ich dieses Zeichen # benutze, müsste ich doch eigentlich einen Kommentar hinzufügen können, den nur ich sehen kann. Genauer gesagt kann ich mir damit einen Vermerk an bestimmten Stellen machen. Leider wird es nur in weiß angezeigt und ebenfalls ausgegeben, gibt es eventuell ein andres Zeichen dafür oder muss ich es anders machen ?

...zur Frage

Einbindung von JS und CSS klappt nicht, könnte die Fehlerursache sein?

Hallo Leute, ich wollte gerade zum besseren Verständnis von getElementById() ein Beispiel nachbauen, dazu habe ich ein HTML-Dokument erstellt und die entsprechenden JavaScript- und CSS-Dateien eingebunden. Die CSS-Datei im Kopfbereich, die JS-Datei vor dem schließenden body-Tag. Am Ende soll ein roter Rahmen um eine Tabelle erzeugt werden.

Ich dachte erst, dass es am falsch eingegebenen Pfad liegen könnte, aber der ist soweit ich sehe auch richtig. Egal was ich tue, die HTML-Datei wird ausgegeben, aber ohne die JS- und CSS-Komponenten.

Hier der zugehörige JS-Code:

Hier der JS-Code:

function init() {
    // Selektion nach ID
    const mainElement = document.getElementById("main");
    mainElement.className = "border";
}

Hier der CSS-Code:

.border {
    border: thick solid red;
    border-radius: 25px;
    padding: 5px 25px 25px 25px;
}

...zur Frage

Javascript, html und css?

Ich habe jetzt mit programmieren angefangen, und um genauer zu sein mit Javascript. Ich weiß jetzt dass man Javascript, HTML und css zusammen kombinieren kann. Ich weiß aber immer noch nicht wie das gehen kann. Haben alle nicht verschiebe Codes oder wie ist es genau zu verstehen ?

...zur Frage

CSS: Wie kann ich bei Hover die Hintergrund- und Schriftfarbe ändern lassen?

Hallo zusammen,

ich würde gerne in diesen Code eine Hover-Funktion einbauen. Da ich Neuling bin, hoffe ich, dass ihr mir die Unbeholfenheit verzeiht.

Bei Hover sollte sich die Hintergrundfarbe und wenn möglich die Schriftfarbe ändern:

*#dm *.dmBody div.u_1159973834 {
  background-color: rgba(255, 255, 255, 0.35) !important;
  border-style: solid !important;
  border-width: 2px !important;
  border-color: rgba(255, 255, 255, 1) !important;
}

Besten Dank für eure Zeit!

...zur Frage

dieser Fehler in der css: "at-rule or selector expected"?

Hallo Ich habe diesen Fehler in meinem css, jemand weiß, wie man dieses Problem zu behebt? Wie auf dem Bild zu sehen ist, steht da "at-rule or selector expected", aber nach mehreren Versuchen weiß ich nicht, wie ich das Problem lösen kann. Bitte um Hilfe.

@charset "UTF-8"; 
{
  box-sizing: border-box;
}
body {
  font-size: 14px;
  font-family: Inter;
}
.v73_77 {
  width: 595px;
  height: 842px;
  background: rgba(255,255,255,1);
  opacity: 1;
  position: absolute;
  top: 0px;
  left: 0px;
  overflow: hidden;
}
.v73_79 {
  width: 451px;
  color: rgba(0,0,0,1);
  position: absolute;
  top: 139px;
  left: 53px;
  font-family: Inter;
  font-weight: Regular;
  font-size: 12px;
  opacity: 1;
  text-align: left;
}
.v73_80 {
  width: 160px;
  height: 160px;
  background: rgba(255,243,236,0);
  opacity: 1;
  position: absolute;
  top: 228px;
  left: 28px;
  border: 1px solid rgba(255,117,51,1);
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  overflow: hidden;
}
.v73_81 {
  width: 160px;
  height: 160px;
  background: rgba(255,243,236,0);
  opacity: 1;
  position: absolute;
  top: 228px;
  left: 213px;
  border: 1px solid rgba(255,117,51,1);
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  overflow: hidden;
}

...zur Frage

Bild in div?

Hi ich möchte ein bild in mein div hinzufügen und es soll oben genau in das div passen ohne rand aber irgendwie bleibt dort immer ein weißer rand.

Hier ein stück meines Html code:

                <section class="boxes">
                    <div class="buybox">
                        <img src="blume/sonnenblume.jpg">
                    </div>
                    <div class="buybox"></div>
                    <div class="buybox"></div>
                    <div class="buybox"></div>
                </section>

Hier ein Stück von CSS:

div {
    padding: 20px;
    text-align: center;
    box-sizing: border-box;
}
.boxes{
    display: flex;
    flex direction: row;
}
.buybox{
    width: 400px;
    height: 420px;
    background: white;
    margin: 25px;
    box-shadow: 0 0 30px rgba(0, 0, 0, .2);
    border-radius: 20px;
    position: relative;
    
}
.buybox img{
    border-radius: 20px;
    height: auto ;
    width: 100% ;
    box-sizing: border-box;
    margin: 0;
}
.buybox:hover{
    transition: .2s;
    background: #E6E6E6;
}

...zur Frage

Wie kann ich den Abstand zwischen HTML-Tags entfernen?

HI, ich programmiere gerade einen Taschenrechner in HTML/CSS/JavaScript und möchte den Abstand zwischen den Elementen entfernen. Margin, Padding und Border sind bereits auf 0 gestellt. Der Abstand ist auch nur horizontal zwischen den Elementen. Vielen Dank im Voraus :-)

...zur Frage

Css Table Design?

Hi ich würde gerne die Border ganz schwarz machen habe auch

border: #black

aber irgendwie ist die border noch grau innen wie bekomme ich das weg?

hab table, td und tr auf schwarz :)))) bitte jemand helfen :p

...zur Frage

Was möchtest Du wissen?

Deine Frage stellen