Verwandte Themen

Sebopeng
24.03.2018, 12:33
Abstand zwischen zwei Tabellen über HTML/CSS?

table.border1 {

  width: 100%; height: 50%;

  border-collapse: collapse;

  text-align: center;

  vertical-align: middle;

  border: 2px solid #000000; }

caption {

  letter-spacing: 2em;

  border: 1px solid #000000;

  background-color: #008080;

  color: #FFFF00;

  font-size: xx-large; }

th, td {

  font-family: Arial;

  padding: 2px;}

th {

  background-color: #ccc;

  border: 1px solid #000000; }

th.WT {

  color: #3FFFFF; }

th.Woche {

 width: 3%; }

th.Block {

 width: 3%; }

th.Zeiten {

 width: 4%; }

td.Woche {

  font-size: 32pt;

  background-color: #FFFF00;

  border-bottom: 2px solid #000000;

  border-right: 1px solid #000000; }

td.Block {

  background-color: #ffff88;

  font-size: 16pt;

  border-bottom: 2px solid #000000;

  border-right: 1px solid #000000; }

td.AZeit {

  background-color: #ffffcc;

  border-bottom: 1px dotted #000000; }

td.EZeit {

  background-color: #ffffcc;

  border-bottom: 2px solid #000000; }

td.Fach {

  border-top: 2px solid #000000;

  border-left: 2px solid #000000;

  border-right: 2px solid #000000;

  border-bottom: 1px dashed #000000;

  background-color: #ffffe8;

  color: #800000;

  font-weight: bold;

  width: 16%; }

td.Lehrer {

  width: 10%;

  border-left: 2px solid #000000;

  border-bottom: 2px solid #000000;

  border-right: 1px dashed #000000;

  background-color: #ffffe8;

  font-size: 10pt; }

td.Raum {

  width: 6%;

  border-bottom: 2px solid #000000;

  border-right: 2px solid #000000;

  background-color: #ffffe8;

  font-size: 12pt; }

td.unten {

  border-bottom: 5px solid #000000;

}

td.Info {

  background-color: #abcdef;

}

td.Info1{

background-color: #FFFF00;

}

td.Info2{

  background-color: #008080;

}

td.Info3{

  background-color: #CCC;

}

td.Info4{

  background-color: #00FFFF;

}

td.Info5{

  background-color: #F5B3FF;

}

td.Info6{

  background-color: #FF00FF;

}

td.Info7{

  background-color: #808000;

}

td.Info8{

 background-color: #BDEDBA;

}

td.Info9{

  background-color: #FFB300;

}

td.Info10{

  background-color: #00FF25;

}

td.Info11{

  background-color: #FF0000;

}

td.Info12{

  background-color: #B18380;

}

td.BB{

  background-color: #FFFF00;

}

td.CC{

  background-color: #008080;

}

td.DD{

   background-color: #CCC;

}

td.EE{

   background-color: #00FFFF;

}

td.FF{

 background-color: #F5B3FF;

}

td.GG{

 background-color: #FF00FF;

}

td.HH{

   background-color: #808000;

}

td.II{

    background-color: #BDEDBA;

}

td.JJ{

   background-color: #FFB300;

}

td.KK{

    background-color: #00FF25;

}

td.LL {

     background-color: #FF0000;

}

td.MM{

    background-color: #B18380;

}

table.border2{

    width: 30%; height: 30%;

   border-collapse: collapse;

  text-align: center;

  vertical-align: middle;

  border: 2px solid #000000; }

Ich möchte gerne zwischen der oberen tabell und er tabell unten(2)einen Abstand haben. Könnt ihr mir bitte schreiben wie das geht.(Die Infos in der Mitte sind nicht wichtig.)

Danke!!!!

Schule, HTML, CSS, Informatik, itg, Tabelle
2 Antworten
kessikatiecat
28.02.2018, 15:18
was bedeutet hart codiert oder Content type?

Hallo! Ich arbeite normalerweise als Grafikerin, da ich mich aber mit HTML und CSS auch ein bisschen auskenne, hat mich ein Kunde gebeten, ein von ihm gekauftes Template nur mit seinen Farben/Texten/Bildern anzupassen. So weit so gut, mit dem bin ich fertig. Jetzt wollte ich ihn fragen, ob er mir die Bilder von seinen Klienten schickt, dass ich sie auch gleich in die Seite einbetten kann.

Er will das lieber selber machen und hat mir nun eine Frage gestellt, wo ich echt nicht weiß, was das bedeuten könnte und auch im Internet finde ich nichts passendes:

"Sind die hardcodiert oder gibt’s für die Bilder einen ContentType?"

Zu den Bildern: Das ist eine Reihe von ausgegrauten Logos, die von einem dünnen grauen Rahmen umgeben sind - demnach hat jedes Logo einen einzelnen Container, alle Logos wiederum sind gemeinsam in einem einzelnen Container, also:

<div class="alle logos">
      <div class="col-lg-2">
        <img src="Template/img-temp/Xx74/img1.png">
      </div>
      <div class="col-lg-2">
        <img src="Template/img-temp/Xx74/img1.png">
      </div>
      <div class="col-lg-2">
        <img src="Template/img-temp/Xx74/img1.png">
      </div>
      <div class="col-lg-2">
        <img src="Template/img-temp/Xx74/img1.png">
      </div>
<div>

(soweit das für die Beantwortung der Frage relevant ist, ich habe echt keine Ahnung was er damit meint)

Danke schonmaaal!

Computer, HTML, programmieren, Code
4 Antworten
DarkNightmare
23.02.2018, 13:42
Bild in einem Parallax Container etwas abschneiden?

Moin,

ich habe eine Parallax Container direkt unter die Nav Bar eingefügt. Es sieht eigentlich recht hübsch aus, auch den Effekt mag ich.

Aber leider ist das Bild etwas hoch, so dass auf der Seite nur der obere Teil des Bildes angezeigt wird.

Kann man das Bild in einem Parallax beschneiden (also etwas vom oberen Teil des Bildes entfernen), oder das Bild zentrieren? Ich würde gerne die Mitte zu beginn sehen und dann diesen scroll Effekt haben. Das Bild sieht momentan wie mittig abgeschnitten aus. Der obere Teil wird angezeigt und der Untere ist nicht vorhanden.

Falls es hilft:

 <div class="parallax-container valign-wrapper">
      <div class="section no-pad-bot">
        <div class="container">
          <div class="row center">
            <h1 class="header col s12 light">TEST</h1>
          </div>
        </div>
      </div>
      <div class="parallax"><img src="img/pic.png"></div> 
    </div>  

Style: .parallax-container {     min-height: 380px;     line-height: 0;     height: auto;     color:  white; }

.parallax-container .section {     width: 100%; }

@media only screen and (max-width : 992px) {     .parallax-container .section {         position: absolute;         top: 40%;     }     #index-banner .section {         top: 10%;     } }

Es hat keinen tieferen Sinn, es ist grade nur eine Spielerei :)

Danke im Voraus.

Computer, Internet, HTML, CSS
1 Antwort
Lillady0894
04.02.2018, 17:10
WFS Layer mit OpenLayers einbinden?

Ich möchte einen WFS-Layer vom GeoServer mithilfe von OL einbinden, dabei habe ich mich an das Beispiel von OpenLayers (vectorWFS) gehalten.

Mein Code sieht wie folgt aus (URLs wurden maskiert wegen GF):

<!DOCTYPE html>
<html>
  <head>
    <title>WFS</title>
    <meta charset="UTF-8">
    <link href="htt ps://openlayers.org/en/v4.6.4/css/ol.css" rel="stylesheet" type="text/css">
    <script src="htt ps://openlayers.org/en/v4.6.4/build/ol.js"></script>
  </head>
  <body>
    <div id="map" class="map"></div>
    <script>
	var vectorSource = new ol.source.Vector({
	   format: new ol.format.GeoJSON(),
	   url: function(extent) {
	      return 'htt p://osmatrix.geog.uni-heidelberg.de/geoserver/' +
		'wfs?version=1.1.0&request=GetFeature&typename=fdepasquale:fdepasquale_countries&maxFeatures=5000&' +
		'outputFormat=application%2Fjson&srsname=EPSG:4326&' +
		'bbox=' + extent.join(',') + ',EPSG:4326';
	   }
	});
			
	var vector = new ol.layer.Vector({
	   source: vectorSource,
	   style: new ol.style.Style({
	      stroke: new ol.style.Stroke({
	         color: 'rgba(0, 0, 255, 1.0)',
		 width: 2
	      })
	   })
	});
			
	var map = new ol.Map({
	    layers: [vector],
	    target: document.getElementById('map'),
	    view: new ol.View({
	       center: [-8908887.277395891, 5381918.072437216],
	       maxZoom: 19,
	       zoom: 12
	    })
	});
    </script>
  </body>
</html>

Leider bekomme ich keinen Layer angezeigt (Chrome) und die Konsole spuckt folgendes aus:

Uncaught SyntaxError: Unexpected token < in JSON at position 0at JSON.parse (<anonymous>)
  at Lo (ol.js:473)
  at Qq.k.Qa (ol.js:473)
 at U.<anonymous> (ol.js:471)

Ich bin totaler Neuling und muss diese Aufgabe für die Uni absolvieren. Vielleicht weiß jemand, was ich falsch gemacht habe.

Die Zoom-Buttons von der Map werden übrigens angezeigt.

HTML, JavaScript, ol, Map
1 Antwort
HamsterKnowHow
15.01.2018, 18:49
Mit Bildern
Mit Links
Wie gestalte ich "Wellen" nur mit CSS?

Moin,

ich frage mich, ob man diesen Übergang zwischen den Farben, sprich die Wellen, mit nur CSS nachbaun kann, bzw womit die das gemacht haben könnten:

https://images.gutefrage.net/media/fragen/bilder/wellen-mit-css-only-machen/0_big.png?v=1516038555252">

Damit meine ich den Übergang zwischen schwarz & weiß, bekommt man sowas mit nur CSS hin oder ist das ne Grafik, etc?

Hab schon gegoogelt aber nicht wirklich sowas in der Art gefunden.

Grüße

Bild zum Beitrag
Computer, HTML, Webseite, CSS, Entwicklung, Webdesign
2 Antworten

Meistgelesene Beiträge zum Thema HTML
Mehr meistgelesene Fragen zu HTML